[Flutter]AppBarのflexibleSpaceとは？

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

AppBarのflexibleSpaceについて、解説します。

背景

flexobleSpaceは、AppBarの背景を設定するための引数です。

「flexibleSpace」に指定したウェジェットは、AppBarのタイトルやアイコンの後ろに表示されます。

なので、テキストやアイコンの背景を設定した際などに使うことが出来ます。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Sample'),
          flexibleSpace: Container(height: 80, color: Colors.pink),
        ),
        body: Center());
  }

まとめ

flexibleSpaceは、AppBarの背景を設定できる引数です。

この引数に指定したウェジェットは、タイトルやアイコンの後ろに表示されます。