[Flutter]AppBar自体にタップイベントを追加するには?

Flutter

どうも、ちょげ(@chogetarou)です。

AppBarそのものにタップイベントを追加するには、どうしたら良いのでしょうか?

スポンサーリンク

方法

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Sample'),
          flexibleSpace: Container(
           child: InkWell(
              onTap: () {
              showDialog(
                  context: context,
                  builder: (BuildContext context) => AlertDialog(
                        title: Text('Tap'),
                      )
              );
            },
          )
         ),
        ),
        body: Center(
          ・・・
        )
     );
  }

簡単な追加方法としては、AppBarのflexibleSpaceを追加します。

flexibleSpaceにタップ処理を追加できるInkWellウェジェットを指定することで、タップイベントを追加できます。

Container(
          child: InkWell(
            onTap:() {
                 //タップ処理
            }
          )
)

flexibleSpaceは、AppBarの背景にウェジェットを配置する引数です。

なので、アイコンやテキスト自体には、タップイベントが追加されません。

もし、アイコンやテキストにイベントを追加したならば、個別に追加しましょう。

コメント

タイトルとURLをコピーしました