![見出し画像](https://assets.st-note.com/production/uploads/images/39592577/rectangle_large_type_2_598dbd86063598160aea0e7177420344.jpeg?width=1200)
Photo by
mericanadesico
【Flutter入門】AppBarの使い方とよく使うプロパティ紹介
AppBarがよく使われるのは、ScaffoldウィジェットのappBarプロパティです。
Scaffold(
appBar: AppBar(),
...
プロパティに何も設定しなければ、テーマカラーのバーが画面上部に表示されるだけです。
ここからはプロパティの紹介をしていきます。
title
おそらく最もよく使われるプロパティで、AppBarの中に表示したいものを記述します。
今回はTextを表示します。
appBar: AppBar(
// 追加
title: Text('title'),
),
centerTitle
titleを中央に表示するかどうかを決めるプロパティで、boolを値を設定します。
appBar: AppBar(
title: Text('title'),
// 追加
centerTitle: true,
),
leading
AppBarの左側に表示するものを設定することができるプロパティです。
appBar: AppBar(
title: Text('title'),
centerTitle: true,
// 追加
leading: Icon(Icons.menu),
),
actions
AppBarの右側に表示するものを設定することができるプロパティです。
appBar: AppBar(
title: Text('title'),
centerTitle: true,
leading: Icon(Icons.menu),
// 追加
actions: [
Icon(Icons.add),
Icon(Icons.clear)
],
),
この記事が気に入ったらサポートをしてみませんか?