title: flutter table calendar events list
body: <p>I'm trying to add events to the table calendar using a list, but without success because the calendar looks like it's in the photo below:</p>
  <p><a href="https://i.stack.imgur.com/Cy4Fm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Cy4Fm.png" alt="Calendar Photo" /></a></p>
  <p>in the documentation they say that the calendar takes a dynamic list, and a function of type date time</p>
  <pre><code>Events 
  The complete example is available here.
  
  You can supply custom events to TableCalendar widget. To do so, use eventLoader property - you will be given a DateTime object, to which you need to assign a list of events.
  
  eventLoader: (day) {
    return _getEventsForDay(day);
  },
  </code></pre>
  <p>well I have a list of dates coming from an api, which is the one below</p>
  <pre><code>[2021-07-11 00:00:00.000, 2021-07-25 00:00:00.000, 2021-07-26 00:00:00.000, 2021-07-27 00:00:00.000, 2021-09-01 00:00:00.000, 2021-09-01 00:00:00.000, 2021-09-03 00:00:00.000, 2021-09-03 00:00:00.000, 2021-09-22 00:00:00.000, 2021-09-24 00:00:00.000, 2021-10-18 00:00:00.000, 2021-10-21 00:00:00.000]
  </code></pre>
  <p>this list is in string format so I converted it like this:</p>
  <pre><code>final events = await _jobsServices.getEvents();
          final eventsConvert = events
              .map((date) =&gt; (DateTime.parse(date.dataDoJob)))
              .toList();
  
  
          eventsList.assignAll(eventsConvert);
  </code></pre>
  <p>the first list called events and the list that receives the data that comes from the api so I converted it to date time format, but as you can see in the photo, all calendar days are marked,</p>
  <p>on my calendar widget I put it like this:</p>
  <pre><code>TableCalendar(
                eventLoader: (day) =&gt; controller.eventsList, //THIS IS THE EVENTS
                calendarBuilders: const CalendarBuilders(),
                focusedDay: controller.focusedDay.value,
                firstDay: DateTime(2019),
                lastDay: DateTime(2050),
                headerStyle:
                    const HeaderStyle(formatButtonVisible: false), //WEEK VISIBLE
                locale: 'pt_BR',
                daysOfWeekVisible: true,
                calendarFormat: controller.format.value,
                onFormatChanged: (CalendarFormat _format) =&gt;
                    controller.calendarFormat(_format),
                onDaySelected: (DateTime userSelectedDay, DateTime focusedDay) =&gt;
                    controller.selectedDay(userSelectedDay, focusedDay),
                calendarStyle: CalendarStyle(
                    selectedTextStyle: const TextStyle(color: Colors.white),
                    isTodayHighlighted: true,
                    selectedDecoration: BoxDecoration(
                        color: context.buttomThemeClicled,
                        shape: BoxShape.circle)),
                selectedDayPredicate: (DateTime date) {
                  return isSameDay(controller.focusedDay.value, date);
                },
              );
  </code></pre>
  <p>if someone can help me I would appreciate it a lot, I've been at it for days</p>
  <p>the docs: <a href="https://pub.dev/packages/table_calendar" rel="nofollow noreferrer">https://pub.dev/packages/table_calendar</a></p>