こんにちは、コン(@pippi_kon)です。
スマホアプリを起動した時、アプリの起動が完了するまでの間、起動画面(ローディング画面)が表示されます。
初期状態だと真っ白な画面が表示されますが、設定によってはオリジナルの画面を表示することができます。
Twitterを起動した時に表示される鳥のマークや、LINEを起動したときに出る吹き出しのマークなんかがそうですね。
そこで今回は、『iPhoneアプリを開いた時に最初に表示される起動画面(スプラッシュ画面)の設定方法』についてご紹介します。
スプラッシュ画面とは
スプラッシュ画面とは、iPhoneアプリを開いたときに一番最初に表示される起動画面のことです。
だいたいは、製作会社のロゴマークとか、アプリのアイコンなどが表示されます。
スプラッシュ画面はアプリを起動するたびに毎回表示されてユーザーの目に入るので、iOSアプリを作るにあたって非常に大切な要素です。
スプラッシュ画面を使って、自身やアプリのイメージを印象付けることができます。
初期状態のスプラッシュ画面
初期状態のスプラッシュ画面には何も設定されていません。

アプリを起動するとこのように真っ白な画面が表示されます。
スプラッシュ画面の設定方法
スプラッシュ画面を設定するためには、Xcode画面の「LaunchScreen.storyboard」を編集します。
初期状態では以下のように何も設定されていません。

繰り返しになりますが、「LaunchScreen.storyboard」を編集するだけでOKです。
他にプログラムコードを組み込んだり、他の設定をいじったりする必要はありません!
今回は「LaunchScreen.storyboard」にLabelを配置してみます。

「起動画面」というラベルを配置してみました。
この真っ白な背景に黒文字で「起動画面」と書かれた画面が、アプリ起動時に表示されます。
シミュレータで確認
作成したスプラッシュ画面をシミュレータで確認してみましょう。

初期状態では真っ白だった起動画面に、先ほど設定したLabel「起動画面」が表示されました!
今回はラベルを配置しましたが、代わりにイメージを配置することでTwitterやLINEのような起動画面を作ることができます。
最後に
今回は、『iPhoneアプリを開いた時に最初に表示される起動画面(スプラッシュ画面)の設定方法』についてご紹介しました。
スプラッシュ画面はiOSアプリを作るにあたって非常に大切な要素となります。
自分だけのオリジナルなスプラッシュ画面を作成して、自身やアプリのアピールを行いましょう!

