【发布时间】:2022-08-04 23:07:36
【问题描述】:
我正在尝试使用来自 Firebase 的事件填充我的表日历小部件。我能够成功地做到这一点,事件被加载到与那天相关的事件列表中。当我点击某一天后列表成功显示时,日历上显示当天有事件的标记没有显示。这是我的一些代码:
@override
void initState() {
_groupEvents();
super.initState();
}
List<PostEvent> _getEventsForDay(DateTime day) {
if (_selectedEvents[day] != null) {
return _selectedEvents[day]!;
}
return [];
}
Map<DateTime, List<PostEvent>> _groupEvents() {
for (var event in postedEvents) {
DateTime date = DateTime(event.dateTimeOfEvent.year,
event.dateTimeOfEvent.month, event.dateTimeOfEvent.day);
if (_selectedEvents[date] != null) {
setState(() {
_selectedEvents[date]!.add(event);
});
} else if (_selectedEvents[date] == null) {
setState(() {
_selectedEvents[date] = [
PostEvent(
title: event.title,
uid: event.uid,
description: event.description,
dateTimeOfEvent: DateTime(
event.dateTimeOfEvent.year,
event.dateTimeOfEvent.month,
event.dateTimeOfEvent.day,
event.dateTimeOfEvent.hour,
event.dateTimeOfEvent.minute),
)
//geohash: event.position.geohash,
//geopoint: event.position.geopoint)
];
});
}
}
return _selectedEvents;
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
child: Column(
children: [
TableCalendar(
focusedDay: selectedDay,
firstDay: DateTime(1990),
lastDay: DateTime(2050),
weekendDays: const [DateTime.friday, DateTime.saturday],
calendarFormat: format,
onFormatChanged: (CalendarFormat _format) {
setState(() {
format = _format;
});
},
startingDayOfWeek: StartingDayOfWeek.sunday,
daysOfWeekVisible: true,
daysOfWeekStyle: const DaysOfWeekStyle(
weekendStyle: TextStyle(
color: Color.fromARGB(255, 46, 39, 39),
fontWeight: FontWeight.bold)),
//Day changed
onDaySelected: (DateTime selectDay, DateTime focusDay) {
setState(() {
selectedDay = selectDay;
focusedDay = focusDay;
});
},
selectedDayPredicate: (DateTime date) {
return isSameDay(selectedDay, date);
},
availableGestures: AvailableGestures.horizontalSwipe,
eventLoader: (day) {
return _getEventsForDay(day);
},
//To style the calendar
calendarStyle: CalendarStyle(
isTodayHighlighted: true,
markerDecoration: BoxDecoration(
color: Theme.of(context).primaryColorLight,
shape: BoxShape.circle),
defaultDecoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(5.0),
),
selectedDecoration: BoxDecoration(
color: Theme.of(context).primaryColor,
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(5.0),
),
selectedTextStyle: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 15.5),
todayDecoration: BoxDecoration(
color: Theme.of(context).primaryColorLight,
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(5.0),
),
weekendTextStyle: const TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
weekendDecoration: BoxDecoration(
color: Theme.of(context).primaryColorLight.withOpacity(0.2),
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(5.0),
)),
headerStyle: const HeaderStyle(
formatButtonVisible: true,
titleCentered: false,
formatButtonShowsNext: false,
formatButtonPadding:
EdgeInsets.symmetric(horizontal: 15, vertical: 7),
formatButtonTextStyle: TextStyle(
//color: Color.fromARGB(255, 161, 48, 48),
fontWeight: FontWeight.bold,
)),
),
..._getEventsForDay(DateTime(
selectedDay.year, selectedDay.month, selectedDay.day))
.map(
(PostEvent event) => ListTile(
leading: const Icon(Icons.event_note_outlined),
title: Text(event.title.toString()),
subtitle: Text(event.description.toString()),
trailing: const Icon(Icons.edit),
onTap: () {
eventPopup(event, context);
},
),
)
],
),
),
当我在_getEventsForDay 中返回[PostEvent()] 而不是[] 时,日历上每一天的标记都会显示,列表中的虚拟数据。当我返回 [] 时,即使在有事件的日子里也没有任何标记显示。我知道函数内部的 if 条件被调用,因为当我点击日期时,事件列表显示在页面上,而不是标记。
任何帮助,将不胜感激。
标签: flutter dart calendar table-calendar