在 TableCalendar Flutter 中显示事件数量

Question

TableCalendar 包有一个 gif 日历示例，其中在一天的右下角显示了给定日期的事件数。

我一直在浏览他们的文档，但未能找到解决方案。

我了解到这些点称为标记，并找到了MarkerBuilder，但我不知道如何在我的代码中实现它。

我该如何实现这一目标？

Answer 1

您可以用自己的函数覆盖标记构建器函数。就像是：

TableCalendar(
   ...
   calendarStyle: const CalendarStyle(
      markersAlignment: Alignment.bottomRight,
   ),
   calendarBuilders: CalendarBuilders(
      markerBuilder: (context, day, events) => events.isNotEmpty
                ? Container(
                    width: 24,
                    height: 24,
                    alignment: Alignment.center,
                    decoration: const BoxDecoration(
                      color: Colors.lightBlue,
                    ),
                    child: Text(
                      '${events.length}',
                      style: const TextStyle(color: Colors.white),
                    ),
                  )
                : null,
   )

)

您可以在那里放置几乎任何您喜欢的东西，因为它只是另一个小部件。