DrawerHeader の使い方

DrawerHeader の使い方

Flutter でマテリアルデザインに沿ってDrawerにヘッダを表示させるためのWidgetです。

このエントリーをはてなブックマークに追加

Drawerのヘッダを表示するために使われます。スマホ上部のステータスバーなどを避けて表示してくれるので、ヘッダを表示する時は使ったほうが便利です。

コンストラクタ

DrawerHeader({
	Key key,
	Decoration decoration,
	EdgeInsetsGeometry margin: const EdgeInsets.only(bottom: 8.0),
	EdgeInsetsGeometry padding: const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 8.0),
	Duration duration: const Duration(milliseconds: 250),
	Curve curve: Curves.fastOutSlowIn, 
	@required Widget child 
})

必須な引数はchildです。

ユーザ情報しか載せない場合はUserAccountsDrawerHeaderを使ったほうが楽です。

プロパティ

  • childWidget

    ヘッダに表示するWidgetを指定する。

  • curveCurve

    decorationが変化した時のカーブアニメーションの指定をします。

  • durationDuration

    decorationが変化したのアニメーションの期間の指定をします。

  • decorationDecoration

    ヘッダの背景を指定できます。背景が変わる時は、curvedurationで指定したアニメーションで滑らかに変わります。

  • marginEdgeInsetsGeometry

    ヘッダの周りのマージンを指定します。指定しない場合const EdgeInsets.only(bottom: 8.0)が指定されています。

  • paddingEdgeInsetsGeometry

    ヘッダの中のパディングを指定します。指定しない場合const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 8.0)が指定されています。

Flutter 公式ドキュメント

DrawerHeader class

このエントリーをはてなブックマークに追加