在 Flutter 的 Second Route widget 中创建日历

Question

我非常使用 Flutter 并且不知道如何在我用作 'second route' 的小部件上包含日历。

class FirstRoute extends StatefulWidget {
  FirstRoute({Key key, this.title}) : super(key: key);

  final String title;

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

class _FirstRoute extends State<FirstRoute> {
  CalendarController _controller;

  @override
  void initState(){
    super.initState();
    _controller = CalendarController();
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: Text('Project'),
      ),
      body: new Center(
        child: new ListView(
          children: <Widget>[
            TableCalendar(calendarController: _controller,)
          ...

目前，这可以在第一页上显示日历，但我想在第二页上显示它：

class SecondRoute extends StatelessWidget {

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Route"),
      ),
      body: SingleChildScrollView(
        child: new ListView(
          children: <Widget>[
          ...

并导航至使用：

          ...
            ListTile(
              title: Text('Calendar'),
              onTap: () {
                Navigator.push(
                     context, 
                     MaterialPageRoute(builder: (context) => SecondRoute())
                );
              },
            ),
          ...

有没有办法在第二条路线中使用TableCalendar(calendarController: _controller,)？我试图将日历代码添加到第二条路线中，但这不起作用，因为您不能在小部件中使用 initState()。谢谢！

Answer 1

如果要在SecondRoute页面中使用initState，必须如下扩展StatefulWidget

class SecondRoute extends StatefulWidget {
    @override
     _SecondRoute createState() => _SecondRoute();
}

class _SecondRoute extends State<SecondRoute> {
  CalendarController _controller;
  @override
  void initState(){
    super.initState();
    _controller = CalendarController();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Second Route"), ),
      body: ListView(
        children: [
            TableCalendar(calendarController: _controller,)
        ],
      ),
   ),
  }
}

在 Flutter 的 Second Route widget 中创建日历

Creating a calendar in Second Route widget in Flutter

widget

dart

flutter