[안드로이드] 스플래시 화면(Splash Screen API)

 

스플래시 화면

대부분의 앱에서 앱을 키면 앱 로고 및 문구가 있는 화면이 잠시 출력된 뒤 메인화면이 보인다.

이 화면을 스플래시 화면이라고 한다. 스플래시 화면은 단순히 보여주기 용도로 넣는 경우도 있지만,

주로 앱에서 필요한 리소스들을 가져올 때 대기 화면 용도로 사용한다.

앱 실행 상태 및 스플래시 화면 작동 방식

앱 실행 상태는 3가지 종류가 있다.

 

• cold-start: 프로세스가 램에 존재하지 않는 상태, 즉 새롭게 시작하는 상태
• warm-start: 앱은 종료되었지만 프로세스가 램에 아직 남아있는 상태에서 실행
• hot-start: 앱과 프로세스가 아직 남아있는 상태에서 실행 -> 앱의 모든 활동이 아직 메모리에 남아있으므로 새롭게 리소스를 불러오지 않아도 됨

위 상태 중 앱 실행 시 앱 프로세스가 실행되지 않았거나(콜드 스타트), 활동이 만들어지지 않은 상태(웜 스타트)라면 다음 이벤트가 발생한다. 스플래시 화면은 핫 스타트 상태일 때는 표시되지 않는다.

 

• 시스템은 개발자가 정의한 테마와 애니메이션을 사용해 스플래시 화면을 표시한다.
• 앱이 준비되면 스플래시 화면이 닫히고 앱이 표시된다.

애니메이션 요소와 메커니즘

스플래시 화면의 콘텐츠에 적용할 애니메이션 요소는 AndroidManifest의 xml 리소스 파일로 정의된다.

애니메이션 요소는 창, 앱 아이콘, 아이콘 배경으로 구성된다.

 

1. 앱 아이콘
2. 아이콘 배경
3. 마스크 처리
4. 창 배경(window background)

스플래시 화면 아이콘은 다음과 같은 크기 제한이 있다.

 

• 브랜드 이미지: 200 x 80 dp
• 아이콘 배경을 포함한 앱 아이콘: 240×240 dp 크기의 정사각형, 160dp 크기의 원
• 아이콘 배경이 없는 앱 아이콘: 288×288dp 크기의 정사각형, 192dp 크기의 원

 

SplashScreen API 적용

1. build.gradle 설정

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

 

2. 스플래시 화면 테마를 설정해 모양 변경

 

액티비티 테마에서 다음 속성을 지정해 앱의 스플래시 화면을 맞춤설정할 수 있다.

* 안드로이드 12에서 아이콘 드로어블이 AnimationDrawable 또는 AnimatedVectorDrawable일 경우, 애니메이션 지속시간을 지정할 수 있다. 13에서는 AVD에 해당 내용이 포함되어 있기 때문에 따로 지정할 필요는 없다.

<!-- Splash 화면의 백그라운드 컬러 지정 -->
<item name="android:windowSplashScreenBackground">@color/color</item>
<!-- Splash 화면의 중앙에 위치할 아이콘 Drawable 지정 -->
<item name="android:windowSplashScreenAnimatedIcon">@drawable/icon</item>
<!-- Splash 화면 중앙의 아이콘 주변 Background Color 지정 -->
<item name="android:windowSplashScreenIconBackgroundColor">@color/color</item>
<!-- Splash 화면이 나타나는 시간 지정 -->
<item name="android:windowSplashScreenAnimationDuration">duration_int</item>
<!-- Splash 화면 하단에 나타낼 브랜딩이미지 지정 (비권장) -->
<item name="android:windowSplashScreenBrandingImage">@drawable/branding_image</item>
<!-- 안드로이드 13 이상에서 스플래시 화면에 아이콘 표시 여부 지정 -->
<item name="android:windowSplashScreenBehavior">icon_preferred</item>

 

res의 themes 파일에서 스플래시 화면에 적용할 테마를 작성한다.

테마 이름은 "Theme.App.Starting"이고, 상위 테마는 "Theme.SplashScreen"이어야 한다.

<style name="Theme.App.Starting" parent="Theme.SplashScreen">
    <item name="windowSplashScreenBackground">@color/white</item>
    <item name="windowSplashScreenAnimatedIcon">@drawable/icon</item>
    <!-- Splash가 끝난 후 사용될 Theme 시정 -->
    <item name="postSplashScreenTheme">@style/Theme.ToyProject1</item>
</style>

* 안드로이드 공식 문서에 쓰여진 가이드에 따라 이미지 크기를 맞췄는데 훨씬 크게 나와 크기를 많이 줄여 사용했다.

확실한 기준을 모르겠어서 크기를 다양하게 적용해 보아야겠다.

 

3. AndroidManifest 파일 설정

 

전 단계에서 설정한 테마를 activity에 적용한다.

<application android:theme="@style/Theme.ToyProject1">
    <activity
        android:name=".views.MainActivity"
        android:exported="true"
        android:theme="@style/Theme.App.Starting">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

 

4. 시작 액티비티 파일 수정

 

앱 시작 액티비티(보통 MainActivity)에서 setContentView를 호출하기 전에 installSplashScreen을 호출한다.

installSplashScreen은 스플래시 화면 객체를 반환하며, 이 객체를 사용하여 애니메이션을 맞춤설정하거나 화면에 스플래시 화면을 더 오래 표시할 수 있다.  

class MainActivity : AppCompatActivity() {

    private lateinit var splashScreen: SplashScreen
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        
        splashScreen = installSplashScreen()
        val binding = DataBindingUtil.setContentView<ActivityMainBinding>(this, R.layout.activity_main)
    }
}

---

Reference

https://developer.android.com/develop/ui/views/launch/splash-screen

Splash screens  |  Android Developers

https://developer.android.com/guide/topics/ui/splash-screen/migrate?hl=ko 

기존 스플래시 화면 구현을 Android 12 이상으로 이전  |  Android 개발자  |  Android Developers

 

https://yoon-dailylife.tistory.com/124

Android) 안드로이드 12 Splash Screen 대응하기

lottie

https://youngest-programming.tistory.com/355

[안드로이드] Lottie Animation 사용법

lottie 스플래시 but not use splashscreen API

https://stickode.tistory.com/67

[Kotlin][Android] Lottie 스플래시(Splash)화면 만들기

 lottie with splashscreen API

https://github.com/vcaen/splashscreen-sample/tree/main/lottiesample

GitHub - vcaen/splashscreen-sample: Sample Repository to demo the AndroidX Splash Screen library

https://lottiefiles.com/

https://airbnb.design/lottie/#get-started

Lottie