flutter - SfCalendar 重复约会

Question

我syncfusion_flutter_calendar在 Flutter 中使用来呈现日历并从 API 加载约会。当我更改日历上的日期并加载更多约会时，之前加载的任何约会都会在日历上显示为重复。我相信我应该清除事件，但我就是不知道该怎么做。

您必须在修改数据源集合时调用 CalendarDataSource 的通知程序以反映 UI 上的更改，即添加到数据源或从数据源中删除的约会。

events.dataSource.clear();
events.notifyListeners(CalendarDataSourceAction.reset, null);

我首先创建了 Widget

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            leading: IconButton(
              onPressed: () => Navigator.of(context).pop(),
              icon: const Icon(
                Icons.keyboard_backspace_rounded,
                color: MyColorTheme.black,
              ),
            ),
            title: const Text('Calendar', style: TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.w600)),
            backgroundColor: Colors.white),
        body: SfCalendar(
          view: CalendarView.day,
          initialSelectedDate: DateTime.now(),
          backgroundColor: Colors.white,
          monthViewSettings: const MonthViewSettings(showAgenda: true),
          headerStyle: const CalendarHeaderStyle(
              textAlign: TextAlign.center, textStyle: TextStyle(fontSize: 13, fontStyle: FontStyle.normal, color: Colors.black, fontWeight: FontWeight.w900)),
          dataSource: _events,
          loadMoreWidgetBuilder: loadMoreWidget,
        ));
  }

它调用 loadMoreWidget 来获取数据。

  Widget loadMoreWidget(BuildContext context, LoadMoreCallback loadMoreAppointments) {
    return FutureBuilder<void>(
      initialData: "loading",
      future: loadMoreAppointments(),
      builder: (context, snapShot) {
        return Container(alignment: Alignment.center, child: const CircularProgressIndicator());
      },
    );
  }

它创建数据源

class MeetingDataSource extends CalendarDataSource {
  MeetingDataSource(this.source);

  List<_Meeting> source;

  @override
  List<dynamic> get appointments => source;

  @override
  DateTime getStartTime(int index) {
    return source[index].from;
  }

  @override
  String getId(int index) {
    return source[index].id;
  }

  @override
  String getStartTimeZone(int index) {
    return source[index].startTimeZone;
  }

  @override
  DateTime getEndTime(int index) {
    return source[index].to;
  }

  @override
  String getEndTimeZone(int index) {
    return source[index].endTimeZone;
  }

  @override
  bool isAllDay(int index) {
    return source[index].isAllDay;
  }

  @override
  String getSubject(int index) {
    return source[index].eventName;
  }

  @override
  Color getColor(int index) {
    return source[index].background;
  }

  @override
  Future<void> handleLoadMore(DateTime startDate, DateTime endDate) async {
    await Future<void>.delayed(const Duration(seconds: 1));
    final accessToken = await AuthService().getAccessToken();
    DateFormat dateFormat = DateFormat("yyyy-MM-ddTHH:mm:ss");
    dynamic url = 'http://api.XXXX.com/calendarEvents?start=' +
        dateFormat.format(startDate) +
        '&end=' +
        dateFormat.format(endDate) +
        '&access_token=' +
        accessToken;
    http.Response data = await http.get(Uri.parse(url));
    dynamic jsonData = json.decode(data.body);
    final List<_Meeting> appointmentData = [];
    for (dynamic data in jsonData['data']) {
      _Meeting meetingData = _Meeting(
          data['title'],
          _convertDateFromString(
            data['start'],
          ),
          _convertDateFromString(data['end']),
          Colors.blue,
          data['allDay'],
          'UTC',
          'UTC',
          data['id']);
      appointmentData.add(meetingData);
    }
    appointments.addAll(appointmentData);
    notifyListeners(CalendarDataSourceAction.add, appointmentData);
  }

  DateTime _convertDateFromString(String date) {
    return DateTime.parse(date);
  }

}

class _Meeting {
  _Meeting(this.eventName, this.from, this.to, this.background, this.isAllDay, this.startTimeZone, this.endTimeZone, this.id);

  String eventName;
  String id;
  DateTime from;
  DateTime to;
  Color background;
  bool isAllDay;
  String startTimeZone;
  String endTimeZone;

  @override
  toString() {
    return "name: " + eventName + " start: " + from.toString();
  }
}

这是整个脚本，如果有人知道如何清除数据源以便我可以刷新事件，我将非常感谢您的帮助。

import 'dart:convert';
import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:intl/intl.dart';
import 'package:radio_workflow/network/auth.dart';
import 'package:radio_workflow/themes/color_theme.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';

class CalendarPage extends StatefulWidget {
  const CalendarPage({Key? key}) : super(key: key);

  @override
  _CalendarPageState createState() => _CalendarPageState();
}

class _CalendarPageState extends State<CalendarPage> {
  final MeetingDataSource _events = MeetingDataSource(<_Meeting>[]);

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            leading: IconButton(
              onPressed: () => Navigator.of(context).pop(),
              icon: const Icon(
                Icons.keyboard_backspace_rounded,
                color: MyColorTheme.black,
              ),
            ),
            title: const Text('Calendar', style: TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.w600)),
            backgroundColor: Colors.white),
        body: SfCalendar(
          view: CalendarView.day,
          initialSelectedDate: DateTime.now(),
          backgroundColor: Colors.white,
          monthViewSettings: const MonthViewSettings(showAgenda: true),
          headerStyle: const CalendarHeaderStyle(
              textAlign: TextAlign.center, textStyle: TextStyle(fontSize: 13, fontStyle: FontStyle.normal, color: Colors.black, fontWeight: FontWeight.w900)),
          dataSource: _events,
          loadMoreWidgetBuilder: loadMoreWidget,
        ));
  }

  Widget loadMoreWidget(BuildContext context, LoadMoreCallback loadMoreAppointments) {
    return FutureBuilder<void>(
      initialData: "loading",
      future: loadMoreAppointments(),
      builder: (context, snapShot) {
        return Container(alignment: Alignment.center, child: const CircularProgressIndicator());
      },
    );
  }
}

class MeetingDataSource extends CalendarDataSource {
  MeetingDataSource(this.source);

  List<_Meeting> source;

  @override
  List<dynamic> get appointments => source;

  @override
  DateTime getStartTime(int index) {
    return source[index].from;
  }

  @override
  String getId(int index) {
    return source[index].id;
  }

  @override
  String getStartTimeZone(int index) {
    return source[index].startTimeZone;
  }

  @override
  DateTime getEndTime(int index) {
    return source[index].to;
  }

  @override
  String getEndTimeZone(int index) {
    return source[index].endTimeZone;
  }

  @override
  bool isAllDay(int index) {
    return source[index].isAllDay;
  }

  @override
  String getSubject(int index) {
    return source[index].eventName;
  }

  @override
  Color getColor(int index) {
    return source[index].background;
  }

  @override
  Future<void> handleLoadMore(DateTime startDate, DateTime endDate) async {
    await Future<void>.delayed(const Duration(seconds: 1));
    final accessToken = await AuthService().getAccessToken();
    DateFormat dateFormat = DateFormat("yyyy-MM-ddTHH:mm:ss");
    dynamic url = 'http://api.radioworkflowinc.com/calendarEvents?start=' +
        dateFormat.format(startDate) +
        '&end=' +
        dateFormat.format(endDate) +
        '&access_token=' +
        accessToken;
    http.Response data = await http.get(Uri.parse(url));
    dynamic jsonData = json.decode(data.body);
    final List<_Meeting> appointmentData = [];
    for (dynamic data in jsonData['data']) {
      _Meeting meetingData = _Meeting(
          data['title'],
          _convertDateFromString(
            data['start'],
          ),
          _convertDateFromString(data['end']),
          Colors.blue,
          data['allDay'],
          'UTC',
          'UTC',
          data['id']);
      appointmentData.add(meetingData);
    }
    appointments.addAll(appointmentData);
    notifyListeners(CalendarDataSourceAction.add, appointmentData);
  }

  DateTime _convertDateFromString(String date) {
    return DateTime.parse(date);
  }

}

class _Meeting {
  _Meeting(this.eventName, this.from, this.to, this.background, this.isAllDay, this.startTimeZone, this.endTimeZone, this.id);

  String eventName;
  String id;
  DateTime from;
  DateTime to;
  Color background;
  bool isAllDay;
  String startTimeZone;
  String endTimeZone;

  @override
  toString() {
    return "name: " + eventName + " start: " + from.toString();
  }
}