このページは Cloud Translation API によって翻訳されました。

スプラッシュ画面

Android 12 以降、SplashScreen API により、アプリの起動時にアニメーションを表示できます。これには、起動時のアプリ行きの動き、アプリアイコンを表示するスプラッシュ画面、アプリ本体への遷移が含まれます。SplashScreenとは Window およびしたがって Activity。

図 1. スプラッシュ画面。

スプラッシュ画面のエクスペリエンスでは、すべてのアプリに標準的なデザイン要素を使用できます。カスタマイズもできるため、独自のブランディングを維持できます。

SplashScreen プラットフォーム API を使用するだけでなく、SplashScreen API をラップする SplashScreen 互換性ライブラリを使用することもできます。

スプラッシュ画面の仕組み

アプリのプロセスが実行されていないときにユーザーがアプリを起動すると（コールド start）、または Activity が作成された場合（ウォームスタート）、次のイベントが発生します。

定義したテーマとアニメーションを使用してスプラッシュ画面が表示されます。
アプリの準備が整うと、スプラッシュ画面は閉じてアプリが表示されます。

スプラッシュ画面が表示されないホットスタート。

スプラッシュ画面の要素とメカニズム

スプラッシュ画面の要素は、 Android マニフェストファイル。各要素にはライトモードとダークモードのバージョンがあります。

スプラッシュ画面のカスタマイズ可能な要素は、アプリアイコン、アイコン背景、ウィンドウ背景で構成されます。

スプラッシュ画面に含まれる要素を示す画像 — **図 2.** スプラッシュ画面のカスタマイズ可能な要素。

図 2 に示す次の要素について考えてみましょう。

1 アプリアイコンはベクター型ドローアブルにする必要があります。静止画でもアニメーションでもかまいません。アニメーションの継続時間に制限はありませんが、1,000 ミリ秒以下にすることをおすすめします。デフォルトはランチャーアイコンです。

2 アイコン背景は省略可能です。アイコンとウィンドウ背景とのコントラストを上げる必要がある場合に便利です。アダプティブアイコンを使用する場合、ウィンドウ背景とのコントラストが十分あれば、背景が表示されます。

3 アダプティブアイコンと同様に、フォアグラウンドがマスクされます。

4 ウィンドウ背景は、不透明な単色で構成されています。ウィンドウ背景が設定され、無地の色である場合、属性が設定されていなければ、デフォルトで使用されます。

スプラッシュ画面のサイズ

スプラッシュ画面のアイコンの仕様は、アダプティブアイコン次のとおりです。

ブランド画像: 200×80 dp にする必要があります。
背景があるアプリアイコン: 直径 160 dp の円に収まる 240 x 240 dp にする必要があります。
アイコンの背景のないアプリアイコン: 288×288 dp で、そのサイズに収まる必要があります直径 192 dp の円。

たとえば、画像の合計サイズが 300 x 300 dp の場合、アイコンを直径 200 dp の円内に収める必要があります。円の外側にあるものはすべて非表示になります（マスクされます）。

図 3. スプラッシュ画面上の背景が無地と透明のアイコンのサイズ。

スプラッシュ画面のアニメーションと起動シーケンス

レイテンシの増加は一般に、コールドスタートでのアプリの起動に関連します。スプラッシュ画面にアニメーションアイコンを追加すると、見た目が良くなり、よりプレミアムなエクスペリエンスを提供しますユーザー調査によると、アニメーションを表示した場合は起動時間が認識されにくいというメリットもあります。

スプラッシュ画面のアニメーションは、次のように起動シーケンスコンポーネント内に埋め込まれます。図 4 に示します。

ランチャーアイコンをタップして画面を拡大し、画面全体に表示するまでの起動シーケンスを 12 枚の連続したフレームで示す画像 — **図 4.** 起動シーケンス。

開始アニメーション: システムビューとスプラッシュ画面で構成されます。これはシステムによって制御され、カスタマイズできません。
スプラッシュ画面（シーケンスの「待機」部分に表示）: スプラッシュ画面はカスタマイズでき、独自のロゴのアニメーションやブランディングの提示に利用できます。要件を満たしている正しく動作することを確認します。
終了アニメーション: スプラッシュ画面を非表示にするアニメーションで構成されます。カスタマイズする場合は、SplashScreenView とそのアイコンを使用します。変換の設定を使用して、任意のアニメーションを実行できます。不透明度、色を指定できますこの場合、スプラッシュ画面を手動で削除して、アニメーションが完了します。

アイコンのアニメーションを実行すると、アプリの起動により、アプリの準備が早く整った場合にシーケンスをスキップするためのオプションが表示されます。アプリが onResume() をトリガーするか、スプラッシュ画面が自動的にタイムアウトするため、モーションを安心してスキップできることをご確認ください。スプラッシュ画面を閉じるには onResume() を使用する必要があります表示が安定していて、スピナーができます。導入するインターフェースが不完全であると、ユーザーに不快感をもたらす可能性があるだけでなく、予測できないという印象や洗練さに欠けるという印象を与えかねません。

スプラッシュ画面のアニメーションの要件

スプラッシュ画面は次の仕様に遵守する必要があります。

ウィンドウ背景を単色で透明度なしに設定します。日中モードと夜間モードは、SplashScreen 互換ライブラリでサポートされています。
アニメーションアイコンが次の仕様を遵守していることを確認します。
- 形式: アイコンは AnimatedVectorDrawable（AVD） XML。
- サイズ: AVD アイコンは、次のように、アダプティブアイコンのサイズの 4 倍にする必要があります。
  - アイコン領域は 432 dp（マスクされていないアダプティブアイコンの 108 dp の領域。
  - 画像の内側の 3 分の 2 がランチャーアイコンに表示されます。 288 dp（実際の 72 dp の 4 倍）にする必要があるは、アダプティブアイコンの内側のマスク領域を構成します。
- 継続時間: スマートフォンでは 1,000 ミリ秒を超えないようにすることをおすすめします。遅延スタートを使用することもできますが、166 ミリ秒以下にする必要があります。アプリの起動時間が 1,000 ミリ秒を超える場合は、ループアニメーションをご検討ください。
スプラッシュ画面を閉じる適切なタイミングを設定します。このタイミングで、アプリは最初のフレームを表示します。説明のとおり、これをさらにカスタマイズできます。詳細をスプラッシュ画面を長時間画面に表示する。

スプラッシュ画面のリソース

図 5. AVD の例。

ダウンロード: スターターキットの例アニメーションを作成、フォーマット、AVD にエクスポートする方法を例示します。次のツールが含まれています。

アニメーションの Adobe After Effects プロジェクトファイル。
最終的にエクスポートされた AVD XML ファイル。
アニメーションの GIF の例。

上記のファイルをダウンロードすると、Google 利用規約に同意したことになります。

このサービスでのデータの取り扱いについては、Google プライバシーポリシーに記載されています。

アプリのスプラッシュ画面をカスタマイズする

windowBackground が単色の場合、SplashScreen はデフォルトでテーマの windowBackground を使用します。スプラッシュ画面をカスタマイズするには、アプリテーマに属性を追加します。

アプリのスプラッシュ画面は、次のいずれかの方法でカスタマイズできます。

テーマ属性を設定して外観を変更する。
長時間表示する。
スプラッシュ画面を閉じるためのアニメーションをカスタマイズします。

始める

コア SplashScreen ライブラリにより、API 23 からすべてのデバイスに Android 12 スプラッシュ画面が導入されます。プロジェクトに追加するには、次のスニペットを build.gradle ファイルを次のように変更します。

Groovy

dependencies {
    implementation "androidx.core:core-splashscreen:1.0.0"
}

Kotlin

dependencies {
    implementation("androidx.core:core-splashscreen:1.0.0")
}

スプラッシュ画面のテーマを設定して外観を変更する

アプリのスプラッシュ画面をカスタマイズするには、Activity テーマに以下の属性を指定します。android:windowBackground のような属性を使用する以前のスプラッシュ画面実装がある場合は、Android 12 以降用の代替リソースファイルを提供することをご検討ください。

背景を特定の単色で塗りつぶすには、windowSplashScreenBackground を使用します。
```
<item name="android:windowSplashScreenBackground">@color/...</item>
```
開始ウィンドウの中央にあるアイコンを置き換えるには、windowSplashScreenAnimatedIcon を使用します。

Android 12（API レベル 32）のみをターゲットとするアプリの場合は、次の操作を行います。

オブジェクトがアニメーション化可能で AnimationDrawable と AnimatedVectorDrawable、windowSplashScreenAnimationDuration を開始ウィンドウが表示されている間にアニメーションが再生されます。Android 13 では、持続時間は AnimatedVectorDrawable から直接推定されるため、これは必要ありません。
```
<item name="android:windowSplashScreenAnimatedIcon">@drawable/...</item>
```
スプラッシュ画面のアイコンアニメーションの継続時間を指定するには、windowSplashScreenAnimationDuration を使用します。この設定はスプラッシュ画面の実際の表示時間には影響しませんが、スプラッシュ画面の終了アニメーションをカスタマイズするときに SplashScreenView.getIconAnimationDuration を使用して取得できます。詳しくは、次のセクションのスプラッシュ画面を長時間表示するをご覧ください。
```
<item name="android:windowSplashScreenAnimationDuration">1000</item>
```
スプラッシュ画面のアイコンの背景を設定するには、windowSplashScreenIconBackgroundColor を使用します。これは、ウィンドウの背景とアイコンのコントラストが十分でない場合に便利です。
```
<item name="android:windowSplashScreenIconBackgroundColor">@color/...</item>
```
windowSplashScreenBrandingImage を使用すると、スプラッシュ画面の下部に表示する画像を設定できます。ただし、デザインガイドラインでは、ブランディング画像の使用は推奨されていません。
```
<item name="android:windowSplashScreenBrandingImage">@drawable/...</item>
```
windowSplashScreenBehavior を使用すると、Android 13 以降で、スプラッシュ画面にアイコンを常に表示するかどうかを指定できます。デフォルト値は 0 です。この場合、アイコンが画面に表示されます。起動アクティビティによって splashScreenStyle が以下に設定されている場合は、スプラッシュ画面 SPLASH_SCREEN_STYLE_ICON, または、起動アクティビティに値が指定されていない場合は、システムの動作に従います。。空のスプラッシュ画面を表示せず、常に表示したい表示するアニメーションアイコンを値 icon_preferred に設定します。
```
<item name="android:windowSplashScreenBehavior">icon_preferred</item>
```

スプラッシュ画面を長時間表示する

スプラッシュ画面は、アプリが最初のフレームを描画するとすぐに閉じます。もし少量のデータをロードする必要が非同期でローカルディスクを使用する場合は、 ViewTreeObserver.OnPreDrawListener 最初のフレームを描画するためにアプリを一時停止します。

開始アクティビティが描画前に終了した場合（例: not コンテンツビューを設定し、onResume（事前描画）の前に終了する使用する必要はありません。

Kotlin

// Create a new event for the activity.
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    // Set the layout for the content view.
    setContentView(R.layout.main_activity)

    // Set up an OnPreDrawListener to the root view.
    val content: View = findViewById(android.R.id.content)
    content.viewTreeObserver.addOnPreDrawListener(
        object : ViewTreeObserver.OnPreDrawListener {
            override fun onPreDraw(): Boolean {
                // Check whether the initial data is ready.
                return if (viewModel.isReady) {
                    // The content is ready. Start drawing.
                    content.viewTreeObserver.removeOnPreDrawListener(this)
                    true
                } else {
                    // The content isn't ready. Suspend.
                    false
                }
            }
        }
    )
}

Java

// Create a new event for the activity.
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // Set the layout for the content view.
    setContentView(R.layout.main_activity);

    // Set up an OnPreDrawListener to the root view.
    final View content = findViewById(android.R.id.content);
    content.getViewTreeObserver().addOnPreDrawListener(
            new ViewTreeObserver.OnPreDrawListener() {
                @Override
                public boolean onPreDraw() {
                    // Check whether the initial data is ready.
                    if (mViewModel.isReady()) {
                        // The content is ready. Start drawing.
                        content.getViewTreeObserver().removeOnPreDrawListener(this);
                        return true;
                    } else {
                        // The content isn't ready. Suspend.
                        return false;
                    }
                }
            });
}

スプラッシュ画面を閉じるためのアニメーションをカスタマイズする

Activity.getSplashScreen() を使用すると、スプラッシュ画面のアニメーションをさらにカスタマイズできます。

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    // ...

    // Add a callback that's called when the splash screen is animating to the
    // app content.
    splashScreen.setOnExitAnimationListener { splashScreenView ->
        // Create your custom animation.
        val slideUp = ObjectAnimator.ofFloat(
            splashScreenView,
            View.TRANSLATION_Y,
            0f,
            -splashScreenView.height.toFloat()
        )
        slideUp.interpolator = AnticipateInterpolator()
        slideUp.duration = 200L

        // Call SplashScreenView.remove at the end of your custom animation.
        slideUp.doOnEnd { splashScreenView.remove() }

        // Run your animation.
        slideUp.start()
    }
}

Java

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // ...

    // Add a callback that's called when the splash screen is animating to the
    // app content.
    getSplashScreen().setOnExitAnimationListener(splashScreenView -> {
        final ObjectAnimator slideUp = ObjectAnimator.ofFloat(
                splashScreenView,
                View.TRANSLATION_Y,
                0f,
                -splashScreenView.getHeight()
        );
        slideUp.setInterpolator(new AnticipateInterpolator());
        slideUp.setDuration(200L);

        // Call SplashScreenView.remove at the end of your custom animation.
        slideUp.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                splashScreenView.remove();
            }
        });

        // Run your animation.
        slideUp.start();
    });
}

このコールバックの開始までに、アニメーションベクター型ドローアブルスプラッシュ画面のタイマーが開始されますアプリの起動にかかる時間によっては、ドローアブルがアニメーションの中ほどにある場合があります。SplashScreenView.getIconAnimationStart を使用して、アニメーションがいつ開始されたのかを把握します。アイコンアニメーションの残りの時間は次のように計算できます。

Kotlin

// Get the duration of the animated vector drawable.
val animationDuration = splashScreenView.iconAnimationDuration
// Get the start time of the animation.
val animationStart = splashScreenView.iconAnimationStart
// Calculate the remaining duration of the animation.
val remainingDuration = if (animationDuration != null && animationStart != null) {
    (animationDuration - Duration.between(animationStart, Instant.now()))
        .toMillis()
        .coerceAtLeast(0L)
} else {
    0L
}

Java

// Get the duration of the animated vector drawable.
Duration animationDuration = splashScreenView.getIconAnimationDuration();
// Get the start time of the animation.
Instant animationStart = splashScreenView.getIconAnimationStart();
// Calculate the remaining duration of the animation.
long remainingDuration;
if (animationDuration != null && animationStart != null) {
    remainingDuration = animationDuration.minus(
            Duration.between(animationStart, Instant.now())
    ).toMillis();
    remainingDuration = Math.max(remainingDuration, 0L);
} else {
    remainingDuration = 0L;
}

参考情報

既存のスプラッシュ画面の実装を Android 12 および高め
Now in Android アプリ: スプラッシュ画面の実装例を示しています