はじめに
「部屋とYシャツと私」みたいなタイトルになりましたが、
SwiftUIのみでアプリ開発する時に便利な、Info.plistでLaunch Screenを設定する方法について記載します。
本当はiOS14時代から設定できるようになっていましたが、Xcode14で試してみると他の方の記事の内容と差異があったので、最新手順や調査結果、所感なども記載します。
まとめ
- 今時のLaunch Screenはカスタマイズして作るものではなくなりました。
Info.plistでLaunch Screenを設定するのであれば、- デフォルト設定のままで良い。(systemBackground背景色のみ)
- 設定したとしても背景色のみで十分。
- iOS16でアップル純正のプリインストールアプリをいくつか調査しましたが、特別なLaunch Screenは設定されておらず、デフォルト設定となっているようです。
理由
ユーザーにしっかりとメッセージを訴求するのが難しいので、手間をかけてLaunch Screenを作るモチベーションが低い。
- 0.5秒程度しか表示されない。
- 画面中央に固定サイズのアイコンを表示する程度しかできない。
- LaunchScreen.storyboardでは可能だった以下の事ができません。
- 画面解像度に合わせてレイアウトを調整する。
- 特に画像サイズの調整。
- iPhone / iPadで表示を変える。
- Portrait / Landscapeで表示を変える。
- 初期化処理が終了するまでLaunch Screen表示を継続する。1
- 画面解像度に合わせてレイアウトを調整する。
- LaunchScreen.storyboardでは可能だった以下の事ができません。
@main
struct project_name_App: App {
var body: some Scene {
WindowGroup { // Launch Screenには手間をかけない。
ContentView() // ここ以降の表現をもっと考えた方が良い。
}
}
}
設定方法
事前準備
プロジェクトの作成
Xcode 14にて上記設定でプロジェクトを作成します。
画像の設定
画像データを用意します。サイズは320x320ポイント以下にしておきます。(説明は後ほど)
Assets
にImage Set
を作成して、名前を設定します。(今回はLaunchImage
に設定)
今回は作業を簡略化するために以下の設定にしました。
-
Scales
=Single Scale
(@2x, @3x画像を使用しない) -
Appearances
=None
(Dark Mode用画像を使用しない)
背景色の設定
Assets
にColor Set
を作成して、名前を設定します。(今回はSystemYellow
に設定)
Color
> Content
に色を設定します。(今回はsystemYellowColor
に設定)
Info.plistの設定
Info.plistの場所
Xcode13以降、新規プロジェクトでInfo.plistが生成されなくなりました。
TARGETS
> Info
> Custom iOS Target Properties
これがInfo.plist相当です。
UILaunchScreenの削除
Launch Screen
を開くと、その下にUILaunchScreen
が設定されていますが、これを削除します。
Image Nameの設定
Launch Screen
の(+)ボタンを押します。
メニューが出てくるのでImage Name
を選択します。
「画像の設定」で作成した「LaunchImage
」をValue
に設定します。
Background colorの設定
Image Name
の下にBackground color
を追加して、「背景色の設定」で作成した「SystemYellow
」をValue
に設定します。
完成
ビルドして実行すればLaunch Screenが表示されるはずです。
Tips
Launch ScreenはOSにキャッシュされますので、開発中にLauncn Screenを変更したら端末を再起動することをお薦めします。(SimulatorはDevice > Restart)
何もしないと、古いLaunch Screenが表示されてしまい、しばらく悩むことになります。
解説
画像サイズ
画像サイズは、(幅 x 高さ):320 x 320 ポイント以下にすることをお薦めします。
(理由は下記参照)
実験
以下の画像を用意しました。
iPhone 14 Pro
で画面いっぱいに表示されるサイズです。
結果
機種 | キャプチャー | 解像度(ポイント) |
---|---|---|
iPhone SE (1st) | 320 x 568 | |
iPhone 14 Pro Max | 428 x 926 |
- 端末の画面サイズに合わせて画像をリサイズしてくれることはなく、そのままのサイズで表示される。
- 表示位置は画面中央になる。
- よって、画像サイズが不適切な場合
- 画面が小さい端末:画像の中央部分しか表示されない。
- 画面が大きい端末:画像の周囲に隙間ができる。
考察
- 画像サイズは、現状で画面が一番小さいiPhone SE (1st)の画面幅(320ポイント)に合わせておけば、画像表示が欠ける心配をしなくて済みます。
- 端末の回転も考慮すると、幅と高さを同じにしておけば良いと思います。
- かつての
LaunchImage
のように画像を全画面表示することは諦めて、アイコンとして表示することを考えた方が良いと思います。
画像の回転
Deployment Info
> Orientation
を設定してあれば、端末の向きに応じて画像が回転します。
画像の複数表示
Image Name
を複数設定しようとしても、Image Name
が既に設定されている旨のアラートが表示されるので、複数の画像を表示することはできません。
Development Environment
- Xcode 14.1 beta 3
- iOS 16.1 beta 4 - iOS 15.0
所感 (ポエム)
-
近年のスマホの高性能化
- 複数のアプリを起動したままにしておいても十分なメモリ量が搭載されるようになった。
- よく使うアプリをApp Switcherで切り替えて使用するケースをよく見るのでLaunch Screenが露出する機会は少なくなっていると感じる。
-
アプリを起動してから操作可能になるまでの表現のトレンド
- 今まで
- Launch Screenのような静止状態でユーザーを待たせる。(ストレスフル)
- これから
-
”新たな表現”でストレスを感じさせない工夫が求められていると感じる。
(または、起動シーケンスの改善によって一瞬でアプリが起動したように感じさせる) -
“新たな表現”の例
- redacted Modifier
- アニメーション
- フェードイン
- サウンド再生
- バイブレーション
-
- 今まで
-
つまり
現状に満足せず、良いアプリを作るために改善を続けていきましょう。
ご注意
ここに記載された内容は個人的な感想や見解ばかりであり、Apple社などの推奨や見解ではありません。