在Table Calendar实施中将事件从Firestore流传输到Flutter

Question

我正在使用Table Calendar Plugin在Flutter的日历上显示事件列表。

这是我用于测试的代码库，其中_events是硬编码的，它是Map<DateTime, List>

import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';

class CalendarPage extends StatefulWidget {
  _CalendarPageState createState() => _CalendarPageState();
}

class _CalendarPageState extends State<CalendarPage> with TickerProviderStateMixin {

  DateTime _selectedDay;
  Map<DateTime, List> _events;
  Map<DateTime, List> _visibleEvents;
  List _selectedEvents;
  AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _selectedDay = DateTime.now();

    _events = {
      DateTime(2019, 7, 5): ['Events 1'],
      DateTime(2019, 7, 13): ['Events 2', 'Event 3'],
      DateTime(2019, 7, 17): ['Events 4', 'Event 5'],
    };


    _selectedEvents = _events[_selectedDay] ?? [];
    _visibleEvents = _events;

    _controller = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 400),
    );

    _controller.forward();
  }


  void _onDaySelected(DateTime day, List events) {
    setState(() {
      _selectedDay = day;
      _selectedEvents = events;
    });
  }

  void _onVisibleDaysChanged(DateTime first, DateTime last, CalendarFormat format) {
    setState(() {
      _visibleEvents = Map.fromEntries(
        _events.entries.where(
          (entry) =>
              entry.key.isAfter(first.subtract(const Duration(days: 1))) &&
              entry.key.isBefore(last.add(const Duration(days: 1))),
        ),
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.pink[700],
        title: Text('Calendar Screen'),
      ),
      body: Column(
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[

          _buildTableCalendar(),
          SizedBox(height: 8.0),
          Expanded(child: _buildEventList()),

        ],
      ),
    );
  }


  // Simple TableCalendar configuration
  Widget _buildTableCalendar() {
    return TableCalendar(
      locale: 'en_US',
      events: _visibleEvents,
      initialCalendarFormat: CalendarFormat.month,
      formatAnimation: FormatAnimation.slide,
      startingDayOfWeek: StartingDayOfWeek.sunday,
      availableGestures: AvailableGestures.all,
      availableCalendarFormats: const {
        CalendarFormat.month: 'Month',
      },
      onDaySelected: _onDaySelected,
      onVisibleDaysChanged: _onVisibleDaysChanged,
    );
  }

  Widget _buildEventList() {
    return ListView(
      children: _selectedEvents
          .map((event) => Container(
                padding: EdgeInsets.all(2.0),
                margin: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 0.0),
                child: Card(
                  elevation: 1.0,
                  child:ListTile(
                  title: Text(event.toString()),
                  onTap: () => print('$event tapped!'),
                ))),
          )
          .toList(),
    );
  }
}

相反，我想从Firestore添加事件，这是我的事件文档设置。

如何从Firestore获取事件stream，将timestamp解析为DateTime，并在Map<DateTime, List>中创建事件initState？ >