1. ホーム
  2. dart

[解決済み] Flutter でプログラム的にモードなボトムシートを閉じる

2022-12-28 21:16:02

質問

BottomSheetを表示するために showModalBottomSheet<Null>() で表示し、GestureDetectorで複数のウィジェットの内部に表示しています。 BottomSheetの外側をタッチしたときだけでなく、内側のGestureDetectorのonTapイベントの後にもBottomSheetが閉じられるようにしたいのですが、GestureDetectorはタッチイベントを転送しないようです。しかし、GestureDetectorはタッチイベントを転送していないようです。

そこで質問ですが、プログラムで ModalBottomSheet の閉鎖をトリガーする方法、または GestureDetector にタッチ イベントを転送するよう指示する方法はありますか。

更新しました(2018-04-12)。

理解を深めるためにコードスニペットを追記します。問題は、"アイテム1"や"アイテム2"をタップしても、ModalBottomSheetが閉じないことです。

showModalBottomSheet<Null>(context: context, builder: (BuildContext context)
{
  return new SingleChildScrollView(child:
    new Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
      new GestureDetector(onTap: () { doSomething(); }, child:
        new Text("Item 1")
      ),
      new GestureDetector(onTap: () { doSomething(); }, child:
        new Text("Item 2")
      ),
    ]),
  );
});

どのように解決するのですか?

ModalBottomSheetをプログラムで閉じるには、次のようにします。

Navigator.pop(context);

GestureDetectorのonTapコールバック関数の中で、このpop関数を呼び出すだけです。

showModalBottomSheet(context: context, builder: (BuildContext context)
{
  return SingleChildScrollView(child:
    Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
      GestureDetector(onTap: () {
          Navigator.pop(context);
          doSomething();
        }, child:
        Text("Item 1")
      ),
      GestureDetector(onTap: () {
          Navigator.pop(context);
          doSomething();
        }, child:
        Text("Item 2")
      ),
    ]),
  );
});