flutter：画面遷移時の”The builder for route "/" returned null.”エラー

Question

前提・実現したいこと

flutter学習で画面遷移を実装しようとしています。
KboyさんのYouTube動画を見て、写経していました。
Navigate with named routesを使おうとしています。

発生している問題・エラーメッセージ

The builder for route "/" returned null.

Route builders must never return null.
The relevant error-causing widget was: 
  MaterialApp file:///Users/to/AndroidStudioProjects/coriander3/lib/main.dart:12:12
When the exception was thrown, this was the stack: 
#0      MaterialRouteTransitionMixin.buildPage.<anonymous closure> (package:flutter/src/material/page.dart:107:9)
#1      MaterialRouteTransitionMixin.buildPage (package:flutter/src/material/page.dart:113:6)
#2      _ModalScopeState.build.<anonymous closure> (package:flutter/src/widgets/routes.dart:826:45)
#3      Builder.build (package:flutter/src/widgets/basic.dart:7118:48)
#4      StatelessElement.build (package:flutter/src/widgets/framework.dart:4620:28)

該当のソースコード

//以下、main.dart
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(

        primarySwatch: Colors.blue,

      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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



  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {

      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(

        title: Text(widget.title),
      ),
      body: Center(

        child: RaisedButton(
          child: Text('次へ'),
          onPressed: (){
            Navigator.pushNamed(context, '/next');
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}



//以下、next_page.dart
import 'package:flutter/material.dart';

class NextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(

        title: Text('次の画面'),
      ),
      body: Container(
        height: double.infinity,
        color: Colors.red,
        child: Center(
          child: RaisedButton(
          child: Text('戻る'),
          onPressed: () {
            Navigator.pop(context);
          },
        ),
      ),
      ),
    );
  }
  
}

試したこと

home: MyHomePage(title: 'Flutter Demo Home Page'),

の記述を削除後、initialRoute以下を追加した際にエラーが起きました。
（その前まではエラーなく動きました。）

//以下を追加
initialRoute: '/',
      routes: {
 
        '/': (context) => MyHomePage(),
       
        '/next': (context) => NextPage(),
      },

補足情報（FW/ツールのバージョンなど）

Android studio 4.0.1
Xcode 11.3.1
MacBook Air (13-inch, 2017)
MacOS Catalina 10.15.1
エミュレータ　iPhone8(mobile)

Answer 1

コードが綺麗に貼れないかったで新しく回答を作らせてもらいました．

これは，Textに指定していない変数widget.titleを入れようとしているからだと思います．
エラーをとるためには，main.dartのコードを以下のように修正してください．

//以下、main.dart
import 'package:flutter/material.dart';
import './next_page.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => MyHomePage(),
        '/next': (context) => NextPage(),
      },
    );
  }
}

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('元の画面'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('次へ'),
          onPressed: () {
            Navigator.pushNamed(context, '/next');
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

ご確認お願いいたします．

Comments

[Inete6Q]

ありがとうございます！！！助かりました。解決できました！
ちなみになんですが、このエラー文の読み方がさっぱりわからないのですが、この文章でどの部分でエラーが発生しているとかってわかるんでしょうか？
お手隙な時でいいので回答いただけるとうれしいです。

[okmt1230z]

よかったです．よかったです．
質問のエラーは二つあるのでまずは一つ目から説明したいと思います．
The builder for route "/" returned null.
ですが，これはNavigatorを使って画面遷移を行おうとしている中で，route / の遷移先が見つからなかった（null）ことが原因です．
しっかりとルーティングのコードを書いてあげることで直ったはずです．
二つ目の，
A non-null String must be provided to a Text widget.
'package:flutter/src/widgets/text.dart':
Failed assertion: line 360 pos 10: 'data != null'
ですが，これは元のコードがText widgetに渡そうとしている値を確認してみてください．
title: Text(widget.title),
この部分です．サンプルコードのなごりでしょうか？
titleという変数に値を入れずにルーティングしているんです．
もし上記のコードのままエラーを取りたかったら，
routes: {
'/': (context) => MyHomePage(title: '元の画面'),
'/next': (context) => NextPage(),
},
としてあげるべきでした．
こちらでも動くのを確認してみてくださいね．

[Inete6Q]

そうなんですね！わかりました。
丁寧なご回答ありがとうございます！

Answer 2

再ビルド後も同じエラーが出ましたでしょうか？
ご確認お願いします。

Comments

[Inete6Q]

コメントありがとうございます。
いじってしまっていたので、コピペして再度実行してみたらエラーコメントが下記に変わりました。

════════ Exception caught by widgets library ═══════════════════════════════════════════════════════
The following assertion was thrown building MyHomePage(dirty, state: _MyHomePageState#12cca):
A non-null String must be provided to a Text widget.
'package:flutter/src/widgets/text.dart':
Failed assertion: line 360 pos 10: 'data != null'

The relevant error-causing widget was:
MyHomePage file:///Users/to/AndroidStudioProjects/coriander2/lib/main.dart:23:27
When the exception was thrown, this was the stack:
#2 new Text (package:flutter/src/widgets/text.dart:360:10)
#3 _MyHomePageState.build (package:coriander2/main.dart:57:16)
#4 StatefulElement.build (package:flutter/src/widgets/framework.dart:4663:28)
#5 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4546:15)
#6 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4719:11)

[okmt1230z]

これは，Textに指定していない変数widget.titleを入れようとしているからだと思います．
エラーをとるためには，main.dartのコードを以下のように修正してください．

```
//以下、main.dart
import 'package:flutter/material.dart';
import './next_page.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: '/',
routes: {
'/': (context) => MyHomePage(),
'/next': (context) => NextPage(),
},
);
}
}

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

final String title;

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

class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;

void _incrementCounter() {
setState(() {
_counter++;
});
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('元の画面'),
),
body: Center(
child: RaisedButton(
child: Text('次へ'),
onPressed: () {
Navigator.pushNamed(context, '/next');
},
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}

```

動きましたら，是非ベストアンサーにお願いします．