今日から毎日ReactNativeを学ぶことにした(21日目)

セリエA第1節が全て終わりました。他もみなきゃ

前回

本日

Stack, Tabs, Drawer, Modals,Shared routesといくつかパターンがあるので上から舐めてく。その後Referencesってのもいくつかあるのでやってくか

↑気づいたらExpo routerを全てみたのでいったん戻ります。

Splash screen and app icon

スプラッシュ(アプリを開いた時のUI)とアイコンのお話。webにはない内容で新鮮な匂いがする。

splash

https://www.figma.com/community/file/1155362909441341285

figmaから画像を持ってくる。

// app.json
{
  "splash": {
    "image": "./assets/images/splash2.png"
  }
}

assetディレクトリに反映(defaultで入ってるじゃん…悔しいのでダウンロードしたやつは名前を変えて上げる)。その後app.jsonに記載を追加。Expo goを起動して検証する。

ビルド中だがデフォルトで画像が表示されてるのでできてる気がする。背景色や画面サイズを設定することも可能。詳細はdocがわかりやすいので参照。

app icon

// app.json
{
  "icon": "./assets/images/icon.png"
}

こちらもpathを指定してapp.jsonに反映させれば良い。

本日のまとめ

アプリの機能を実装した!web界隈の人間からすると新鮮!

この記事が気に入ったらサポートをしてみませんか?