はじめに

Compose Multiplatformを使ってモバイルアプリ開発を進める中で、公式ドキュメントが少なく、情報収集に苦労しました。
その経験をもとに、学んだことを備忘録として記録し、同じように困っている開発者の参考になればと思い、Qiitaに記事を残していくことにしました。

今回は、AndroidとiOSそれぞれのスプラッシュ画面（起動画面）を設定する方法を解説します。
独自の画面遷移は用意せずに、それぞれOS標準の機能を利用して設定しました。

環境

Kotlin Multiplatform Wizardからプロジェクトを作成
使用するアイコンはAndroidのスプラッシュ画面のルールに従って作成
IDE:
- Android Studio 2024.2.1
- Xcode 16.1

1. Android側の設定

Androidでは、androidx.core:core-splashscreenライブラリを使用して設定します。

1-1. ライブラリの追加

バージョンカタログの設定

libs.versions.toml で core-splashscreen のバージョン管理をします。

libs.versions.toml

core-splashscreen = "1.0.1"

[libraries]
core-splashscreen = { group = "androidx.core", name = "core-splashscreen", version.ref = "core-splashscreen" }

依存関係の追加

バージョンカタログの内容を元に、build.gradle.kts に依存関係を追加します。

build.gradle.kts

androidMain.dependencies {
    implementation(libs.core.splashscreen)
}

1-2. アイコンの追加

composeApp/src/androidMain/res を右クリックし、New -> Vector Asset を選択し、使用するアイコンを追加します。

1-3. スタイル設定 (`splash.xml`)

composeApp/src/androidMain/res/values/splash.xml を作成し、利用するスタイルを指定します。

splash.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="Theme.App.Starting" parent="Theme.SplashScreen">
        <item name="windowSplashScreenBackground">#33C659</item> <!-- 背景色 -->
        <item name="windowSplashScreenAnimatedIcon">@drawable/sample_splash_icon</item> <!-- アイコン -->
        <item name="postSplashScreenTheme">@android:style/Theme.Material.NoActionBar</item> <!-- SplashScreen表示後のテーマ -->
    </style>
</resources>

1-4. マニフェストの設定 (`AndroidManifest.xml`)

1-3で作成したスタイルをマニフェストに設定します。

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">

    <application
        ...
        android:theme="@style/Theme.App.Starting"> <!-- 追加 -->
        <activity
            ...
            android:theme="@style/Theme.App.Starting"> <!-- 追加 -->
            ...
        </activity>
    </application>

</manifest>

1-5. `MainActivity.kt`を編集

1-4までの設定でもスプラッシュ画面の表示は切り替わりますが、スタイルの一部が反映されません。
MainActivityに以下のように設定を追加します。

MainActivity.kt

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        installSplashScreen() // 追加

        setContent {
            App()
        }
    }
}