けーじーのブログ

旅行の記録と撮った写真と時々技術的な話を書く

Flutterでアプリ起動画面

Flutterを学び始めて、アプリ起動時の画面(スプラッシュって言うのかもしれない)を付けてみました。

Androidiosで実装方法が違う?らしいのですがAndroid用の開発環境しか構築してないのでiosでの知見はありません。あしからず。

 

画面

f:id:zyundamochi_080:20190225224817p:plain

 

f:id:zyundamochi_080:20190225223857p:plain

 

アプリを起動すると1枚目のような画面が出て、アプリが読み込まれると2枚目の画面が出てきます。

 

実装

アプリの内容はgoogleのcodelabsのものなので割愛。

  1. 出したい画像(今回は最初から入っているic_launcher.pngを利用)を↓に入れるandroid/app/src/main/res/mipmap-xxx
  2. android/app/src/main/res/values/styles.xml
    <color name="background">#bfbfbf</color>
  3. android/app/src/main/res/drawable/launch_background.xml
    以下のようにする

    f:id:zyundamochi_080:20190225225901p:plain

  4. 実行する

 

コードは↓にあります。

github.com

 

せっかくのクロスプラットフォームなんでiosの環境も構築するべきなんでしょうけど、実機持ってないしイマイチやる気が上がってこないのは何故なんでしょうね...?