虎視眈々と

Flutter × Firebaseを研究するアプリエンジニア

FlutterでAppBarの影を消す

f:id:superman199323:20181014100827p:plain

FlutterでAppBarの影を消す

最近のよくあるUIとしてAppBarの影を消して、AppBarの下のViewになじませる方法があります。

例をあげるとKyashの送金画面とかはまさしくこれです。

f:id:superman199323:20181012094630p:plain

今回はその方法について書きます。

AppBarにelevationを設定する

実装方法についてはかなり簡単です。

AppBarelevation 属性を0.0に設定すれば実装できます。

      appBar: AppBar(
        title: Text("プロフィール"),
        elevation: 0.0,
      ),

これを設定すればこんなAppbarが

f:id:superman199323:20181012094929p:plain

こうなります。

f:id:superman199323:20181012095243p:plain