未显示SyncFusion日历

Question

我看了一段关于Syncfusion Calendar的视频，虽然它可以作为一个独立的小部件工作，但当我们尝试在我们的应用程序中实现它时，它永远不会工作。它会让我们看到一个空白屏幕，或者Appbar和FloatingActionButton只出现。如何才能使其可见？

请注意，我们不会将此小部件作为主页面，并且必须可以从仪表板本身访问。

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

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

class _CalendarTeacherPageState extends State<CalendarTeacherPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(child: const CalendarWidget()),
      appBar: AppBar(
        title: const Text('Calendar'),
        centerTitle: true,
      ),
      floatingActionButton: FloatingActionButton(
        child: const Icon(Icons.add, color: Colors.white),
        backgroundColor: Colors.red,
        onPressed: () => Navigator.of(context).push(
          MaterialPageRoute(builder: (context) => const EventEditingPage()),
        ),
      ),
    );
  }
}

这是为我们的CalendarWidget准备的，我们认为它保存了错误。

class CalendarWidget extends StatelessWidget {
  const CalendarWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final events = Provider.of<EventProvider>(context).events;

    return SfCalendar(
      view: CalendarView.schedule,
      dataSource: EventDataSource(events),
      initialSelectedDate: DateTime.now(),
      cellBorderColor: Colors.transparent,
      onLongPress: (details) {
        final provider = Provider.of<EventProvider>(context, listen: true);

        provider.setDate(details.date!);
        showModalBottomSheet(
          context: context,
          builder: (context) => const TasksWidget(),
        );
      },
    );
  }
}

将这些代码从作为主要小部件的SfCalendar迁移到我们仪表板的一部分已经被证明是困难的，我只知道问题出在SfCalendar中，以及我将它放在哪里。我该如何解决这个问题？

Answer 1

基于代码片段，我们已经检查了前面提到的问题“日历没有渲染”，从我们的角度来看，它工作得很好。我们已经附加了相同的代码片段。

代码片段：

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';

void main() {
  return runApp(const Calendar());
}

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

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

class CalendarState
    extends State<Calendar> {



  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          floatingActionButton: FloatingActionButton(
            child: const Icon(Icons.add),
            onPressed: () {},
          ),
          appBar: AppBar(
            title: const Text('text'),
          ),
          body: const CalendarPage()),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SfCalendar();
  }
}

Answer 2

我意识到我在应用程序中遗漏了一些东西，那就是ChangeNotifier。通过将代码更改为以下代码...

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

  @override
  State<CalendarTeacher> createState() => _CalendarTeacher();
}

class _CalendarTeacher extends State<CalendarTeacher> {
  @override
  Widget build(BuildContext context) => ChangeNotifierProvider(
        create: (context) => EventProvider(),
        child: Scaffold(
          appBar: AppBar(
            title: const Text("Calendar"),
            centerTitle: true,
          ),
          body: CalendarWidget(),
          floatingActionButton: FloatingActionButton(
            child: Icon(Icons.add, color: Colors.white),
            backgroundColor: Colors.red,
            onPressed: () => Navigator.of(context).push(
              MaterialPageRoute(builder: (context) => const EventEditingPage()),
            ),
          ),
        ),
      );
}

在某种意义上，我完全忘记了EventProvider，所以现在一切都好了！