2022/10/18

【Swift UIKit】アプリ起動時のスプラッシュ画面の実装方法！LaunchScreen.storyboard

この記事からわかること

SwiftのUIKitでスプラッシュ画面を実装する方法
アプリ起動時にロゴなどを表示させるには？
LaunchScreen.storyboardの役割
起動時間を稼ぐ方法

index

[open]

＼アプリをリリースしました／

友達や家族の誕生日をメモ！通知も届く-みんなの誕生日-

posted withアプリーチ

アプリ起動時によくある立ち上げ画面の実装方法をまとめていきます。

スプラッシュ画面とは？

スプラッシュ画面とはアプリケーションを起動させた際に最初に表示される画面のことを指します。用途としてはアプリの初期画面までの起動に時間がかかってしまう際などにユーザーに対して起動していることを知らせたり、起動までの時間を稼いでもらうために使用されます。

【Swift UIKit】アプリ起動時のスプラッシュ画面の実装方法！LaunchScreen.storyboard

上記のようにロゴを表示させたり、ローディングであることを示したり、宣伝などを流すことが多いです。

iOSアプリのスプラッシュ画面の作成方法

SwiftのUIKitフレームワークを使用して開発しているiOSアプリにスプラッシュ画面を導入する方法をまとめていきます。

導入するのは簡単でStoryboard(Interface Builder)を使用して設定していきます。プロジェクト作成時にinterfaceを「Storyboard」に設定すると以下のようなファイル構成がデフォルトで作成されます。

├── Swiftプロジェクト
│   ├── プロジェクト名
│        ├──  AppDelegate.swift
│        ├──  SceneDelegate.swift
│        ├──  ViewController.swift
│        ├──  Main.storyboard
│        ├──  Assets.xcassets
│        ├──  LaunchScreen.storyboard
│        └──  info.plist
│   └── プロジェクト名.xcodeproj

LaunchScreen.storyboardから設定する

この中の「LaunchScreen.storyboard」がデフォルトではスプラッシュ画面の設定を行うファイルとなっています。設定方法は画面に対して表示させたいビューを配置するだけです。ビューの配置にはAutoLayoutなどを使ってデバイスによって崩れないようにしておきます。

設定できたら念の為以下のデバイスくらいは確認しておくと良いです。

チェックするデバイス

iPhone SE 3rd
iPhone 13 Pro Max
iPad Pro 12.9-inch

起動時間のかからないアプリの場合

アプリの起動にそれほど時間がかからないけれどスプラッシュ画面を導入したい場合は「AppDelegate.swift」内にsleepを使って時間を稼ぎます。時間は1秒ほどで良いと思います。

import UIKit
import GoogleMobileAds

@main
class AppDelegate: UIResponder, UIApplicationDelegate {

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        // Override point for customization after application launch.
        sleep(1)
        return true
    }
    // MARK: UISceneSession Lifecycle

おすすめ記事：【Swift】処理を停止させる方法！Thread.sleep

LaunchScreenファイルを切り替える

プロジェクト作成時はデフォルトでスプラッシュ画面が「LaunchScreen.storyboard」にアプリ画面が「Main.storyboard」となってます。この設定は「Build Setting」＞「Info.plist Values」の中からの中から変更することができるので設定したいstoryboardファイルがあればそのファイル名を記入すればOKです。