[Swift/Xcode]初心者必見！iOSアプリ作成から公開まで徹底解説！#30「スプラッシュ画面編」

今回はスプラッシュ画面の作成をしたいと思います！

スプラッシュ画面はアプリ起動時にアイコンとかが表示されるアレです！

動作環境は下記の通りです！
Xcode Version 12.5　Swift version 5.4

スプラッシュ用の画像作成

まずはiphone用とipad用の画像を作成します！

サイズはこちらです。

[iPhone]
828 × 1792
1125 × 2436
1242 × 2688

[iPad]
768 × 1024
1536 × 2048

作成した画像は全サイズ最後に載せておきますので、試しに使ってみる場合はダウンロードして下さい〜！

画像を設定

画像ができたらAssets.xcassetsフォルダに格納します！

今回はiPhoneとiPadで表示させる画像をわけないといけないので
ただ画像をドラッグ&ドロップするだけではダメで下記画像の手順で画像を格納します！

LaunchScreen.storyboardを使う

では格納した画像を使用する為の方法を説明いたします。

今回はLaunchScreen.storyboardを使用します。

下記の手順で設定しましょう！

これで画像を設定できました！

次は画像を画面いっぱい広げる為のレイアウトを設定します。

上記画像と同じように、左右下と制約をつければOKです！

最後にAppDelegate.swift修正をちょこっと修正します！

アプリの起動が早過ぎたらスプラッシュ画像が一瞬だけしか表示されないので、1秒だけ表示させるようにします。

追加したのはコードの3行目です。

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    //スプラッシュの為に少し起動を遅らせる
    sleep(1)
    //ナビゲーションバーの色がデフォルトだと半透明になってしまうので、半透明にさせないよう設定
    UINavigationBar.appearance().isTranslucent = false
    //初回起動時判定。初期値をtrueに設定。アプリの更新では無視されます。
    let ud = UserDefaults.standard
    let firstLunchKey = "firstLunch"
    let firstLunch = [firstLunchKey: true]
    ud.register(defaults: firstLunch)
    
    return true
}

これでスプラッシュ画像の設定は完了です！

iPhoneとiPadでビルドして確認してみましょう！！

まとめ

これでアプリ開発のほとんどの作業が終わったので、次は細かい調整をして完了です！

やっとです！

最初から全部読んでくれてる人はいるんだろうか、、、
もし居たら感謝です。

あと少し頑張りましょう！！！

修正したコード全部

AppDelegate.swift

import UIKit
@main
class AppDelegate: UIResponder, UIApplicationDelegate {
    
var window: UIWindow?
 
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    //スプラッシュの為に少し起動を遅らせる
    sleep(1)
    //ナビゲーションバーの色がデフォルトだと半透明になってしまうので、半透明にさせないよう設定
    UINavigationBar.appearance().isTranslucent = false
    //初回起動時判定。初期値をtrueに設定。アプリの更新では無視されます。
    let ud = UserDefaults.standard
    let firstLunchKey = "firstLunch"
    let firstLunch = [firstLunchKey: true]
    ud.register(defaults: firstLunch)
    
    return true
}

// MARK: UISceneSession Lifecycle

func application(_ application: UIApplication, configurationForConnecting connectingSceneSession: UISceneSession, options: UIScene.ConnectionOptions) -> UISceneConfiguration {
    // Called when a new scene session is being created.
    // Use this method to select a configuration to create the new scene with.
    return UISceneConfiguration(name: "Default Configuration", sessionRole: connectingSceneSession.role)
}

func application(_ application: UIApplication, didDiscardSceneSessions sceneSessions: Set<UISceneSession>) {
    // Called when the user discards a scene session.
    // If any sessions were discarded while the application was not running, this will be called shortly after application:didFinishLaunchingWithOptions.
    // Use this method to release any resources that were specific to the discarded scenes, as they will not return.
}
}

スプラッシュ用の画像

iphone用 左

iphone用 真ん中

iphone用 右

iPad用　左

iPad用　右