【flutter】The method 'findAncestorStateOfType' was called on null. Receiver: null Tried calling: find

解決したい課題

ListTileのメニューをタップしたらBottomSheetが表示されるようにしたいです。

現状

メニュー１をタップすると下記エラーが表示されます。

======== Exception caught by gesture ===============================================================
The following NoSuchMethodError was thrown while handling a gesture:
The method 'findAncestorStateOfType' was called on null.
Receiver: null
Tried calling: findAncestorStateOfType<NavigatorState>()

コード

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  static const String _title = 'narururu';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: MyAppState(),
    );
  }
}
class MyAppState extends StatelessWidget {
  BuildContext get context => null;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('narururu'),
        ),
        body: ListView(
            children: [
              _menuItem("メニュー1", Icon(Icons.settings)),
              _menuItem("メニュー2", Icon(Icons.map)),
              _menuItem("メニュー3", Icon(Icons.room)),
              _menuItem("メニュー4", Icon(Icons.local_shipping)),
              _menuItem("メニュー5", Icon(Icons.airplanemode_active)),
            ]
        ),
      ),
    );
  }

  Widget _menuItem(String title, Icon icon) {
    return GestureDetector(
      child:Container(
          padding: EdgeInsets.all(8.0),
          decoration: new BoxDecoration(
              border: new Border(bottom: BorderSide(width: 1.0, color: Colors.grey))
          ),
          child: Row(
            children: <Widget>[
              Container(
                margin: EdgeInsets.all(10.0),
                child:icon,
              ),
              Text(
                title,
                style: TextStyle(
                    color:Colors.black,
                    fontSize: 18.0
                ),
              ),
            ],
          )
      ),
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => BottomSheetButton(),
          )
        );
      }
    );
  }
}

// ignore: must_be_immutable
class BottomSheetButton extends StatelessWidget {
  var result =  showModalBottomSheet;
  @override
  Widget build(BuildContext context) {
            return Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                ListTile(
                  leading: Icon(Icons.music_note),
                  title: Text('Music'),
                  onTap: () => Navigator.of(context).pop(1),
                ),
                ListTile(
                  leading: Icon(Icons.videocam),
                  title: Text('Video'),
                  onTap: () => Navigator.of(context).pop(2),
                ),
                ListTile(
                  leading: Icon(Icons.camera),
                  title: Text('Picture'),
                  onTap: () => Navigator.of(context).pop(3),
                ),
              ],
            );
  }
}

調べてはいるものの一向に解決に至らず。
アドバイスが欲しいです。
どなたかよろしくお願いいたします。

行動規範の内容に同意します

回答1件

ベストアンサー

とりあえずBottomSheetは出ると思います。
BottomSheet自体初めて見るので何かおかしかったらすみません笑
あとエラーの理由もよくわからないですね笑

popメソッドで戻った時に1,2,3の値を取得できるんですかね。
よくわかりませんが笑
できると便利ですね。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  static const String _title = 'narururu';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: MyAppState(),
    );
  }
}
class MyAppState extends StatelessWidget {
  //BuildContext get context => null;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('narururu'),
        ),
        body: ListView(
            children: [
              _menuItem(context,"メニュー1", Icon(Icons.settings)),
              _menuItem(context,"メニュー2", Icon(Icons.map)),
              _menuItem(context,"メニュー3", Icon(Icons.room)),
              _menuItem(context,"メニュー4", Icon(Icons.local_shipping)),
              _menuItem(context,"メニュー5", Icon(Icons.airplanemode_active)),
            ]
        ),
      ),
    );
  }

  Widget _menuItem(BuildContext context,String title, Icon icon) {
    return GestureDetector(
        child:Container(
            padding: EdgeInsets.all(8.0),
            decoration: new BoxDecoration(
                border: new Border(bottom: BorderSide(width: 1.0, color: Colors.grey))
            ),
            child: Row(
              children: <Widget>[
                Container(
                  margin: EdgeInsets.all(10.0),
                  child:icon,
                ),
                Text(
                  title,
                  style: TextStyle(
                      color:Colors.black,
                      fontSize: 18.0
                  ),
                ),
              ],
            )
        ),
        onTap: () {
          showModalBottomSheet<void>(
            context: context,
            builder: (BuildContext context) {
              return BottomSheetButton();
            }
          );

          /*
          Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => BottomSheetButton(),
              )
          );
           */
        }
    );
  }
}

// ignore: must_be_immutable
class BottomSheetButton extends StatelessWidget {
  var result =  showModalBottomSheet;
  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        ListTile(
          leading: Icon(Icons.music_note),
          title: Text('Music'),
          onTap: () => Navigator.of(context).pop(1),
        ),
        ListTile(
          leading: Icon(Icons.videocam),
          title: Text('Video'),
          onTap: () => Navigator.of(context).pop(2),
        ),
        ListTile(
          leading: Icon(Icons.camera),
          title: Text('Picture'),
          onTap: () => Navigator.of(context).pop(3),
        ),
      ],
    );
  }
}

投稿2021/01/31 17:49

moriman

総合スコア615

narururu

2021/02/01 05:41

ご回答ありがとうございます。morimanさん☺ BottomSheet表示、確認できました。ありがとうございます！私の方でも、あれからいろいろ試してみて表示できるコードを記述できるようになりました。エラーコードは不明のままですが、課題は解決したのでクローズにしようと思います。ご丁寧にアドバイスしていただき本当にありがとうございました！

行動規範の内容に同意します