안드로이드 Splash Screen API 적용하기

21년도 구글에서 새로운 Splash Screen에 대해서 발표하였습니다.

이제는 이를 적용하지 않는 Android12이상의 기기에서는,

이중으로 Splash화면이 보여지고 있는데요.

오늘은 SplashScreen 를 적용하는 방법에 대해 알아보겠습니다.

 

1. 하위 호환성 위한 라이브러리 설치

새로운 SplashScreen은 Android 12버전부터만 적용가능합니다.

따라서 그 이하의 기기에서의 호환성을 위해서는 아래의 라이브러리가 필요합니다.

build.gradle에 아래 한 줄을 추가해 줍니다.

 

implementation 'androidx.core:core-splashscreen:1.0.1'

 

 

 

2. 이미지 준비

먼저 새로운 Splash화면을 적용할 이미지가 준비되어야 합니다.

기존에 Splash이미지를 가지고 계신 분들은,

예전의 Splash이미지에서 적절하게 잘라서 사용할 필요가 있겠네요.

 

구글에서 지정한 이미지 스펙은 두가지가 있습니다.

배경색이 있는 아이콘과 없는 아이콘인데요.

각각 보겠습니다.

 

2-1. 배경색이 있는 아이콘

아래의 원은 그냥 가이드라인이지, 사용자에게 원모양으로 보여지는 것이 아닙니다.

저 원을 벗어나지 않게 넣으라는 것 입니다.

 

 

 

저는 아래와 같이 두고 작업을 했습니다.

240dp의 가이드박스를 두고요.

160dp의 원을 그려서 가운데에 위치시킵니다.

 

 

디자인이나 취향마다 다르겠지만,

저는 원안의 보라색 사각형을 벗어나지 않게,

이미지를 넣는 것이 좋았습니다.

 

기기마다 다를 수 있지만,

Splash Screen에 실제로 보여지는 화면에 주의할 점이 있습니다.

아이콘과 스프래쉬 전체 배경색을 구분하는 외곽선은,

가이드에 보이는 것 같은 완벽한 원이 아니라,

특이한 값의 라운드를 가진 둥그런 형태의 사각형이라는 점 입니다.

 

2-2. 배경색이 없는 아이콘

오히려 배경색이 없는 아이콘이 더 자연스러운 경우가 있는데요.

아래와 같이, 바깥쪽은 288dp이고,

안쪽은 192dp원 안에 들어오게 작업해야 합니다.

 

 

 

3. theme.xml에서 적용하기

3-1. Style 작성

태그가 style이여서, style.xml에서 해야할 것 같지만,

themes.xml에 정의하라고 권고되어 있습니다.

물론, style.xml에서 해도 문제는 없습니다.

 

먼저 styles.xml이 있던 디렉토리에,

themes.xml 이 없다면 생성한 다음,

아래와 같이 작성해 줍니다.

이 속성들은, Splash테마를 통해서 Splash화면의 디자인을 정의하는 것인데요.

무슨 의미인지 아래에서 보겠습니다.

 

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="Theme.App.Starting" parent="Theme.SplashScreen">
        <item name="windowSplashScreenBackground">@color/colorToolbarBg</item>
        <item name="windowSplashScreenAnimatedIcon">@drawable/img_splash_logo</item>
        <item name="windowSplashScreenAnimationDuration">1000</item>
        <item name="windowSplashScreenIconBackgroundColor">@android:color/transparent</item>
        <item name="postSplashScreenTheme">@style/Theme.BananaAlarm</item>
    </style>
</resources>

 

 

 

가장 중요한 것은 Background와 Icon 그리고 BackgroundColor입니다.

• windowSplashScreenBackground: 전체 스플래시 화면의 배경색
• windowSplashScreenAnimatedIcon: 중앙의 원안에 표시되는 아이콘
• windowSplashScreenIconBackgroundColor: 아이콘 뒤에 있는 원형 배경색
  • 원형 배경을 없애고 싶은 경우는 아래 값을 사용
    • @android:color/transparent
    • 아이콘 이미지에 이미 배경이 포함되어 있을경우, 이 원형 배경이 방해될 수 있으므로 transparent로 설정하는 것이 좋습니다.
    • 기본값은 colorPrimary임
• postSplashScreenTheme: 스플래쉬 이후에 사용할 테마지정.
• windowSplashScreenAnimationDuration: 스플래쉬 지속시간, 밀리미터 단위(아무리 많이해도 최대1초로 제한됨)

 

3-2. Branded Image 추가하기

여기에 한가지 더 설정할 수 있는 것이 있는데요.

화면 하단에 아래와 같은 스펙으로 넣을 수 있는 브랜디드 이미지입니다.

아무래도, 이미지만으로 구분할 수 없는 유명하지 않는 앱은 그 이름등을 표시하는 것이 좋을 수 있겠지요.

아쉽게도 크기와 위치를 저희가 특정할 수는 없습니다.

• 크기: 200×80 dp
• 위치: 화면하단에서 16dp 간격 위에 위치시켜 줌

style에는 아래와 같이 추가해 주면 되고요.

 

<item name="windowSplashScreenBrandingImage">@drawable/branding_image</item>

 

 

 

이 값을 설정하면, xml에 빨간색으로 경고가 뜨는데요.

API23이상부터 적용가능하기 때문입니다.

따로 할 것은 없고, 그 아래 버전의 기기에서는 적용되지 않는다는 점만 기억하면 됩니다.

 

4. Manifest 선언하기

이렇게 설정한 스타일은 Manifest에서 지정해주면 됩니다.

아래의 .SplashActivity에서,

"android:theme="@style/Theme.YourApp.Starting" 이라고,

theme을 지정해주면 됩니다.

 

SplashActivity가 따로 필요하지 않은 분들은,

MainActivity에서 정의해서 사용해도 됩니다.

저는 개인적으로 Splash에서 버전체크등 로직을 수행하기 때문에,

Splash를 그대로 사용합니다.

게다가, MainActivity의 코드가 복잡해지는 것도 원하지 않구요.

 

<application
    android:theme="@style/Theme.YourApp"
    ...>
    
    <activity
        android:name=".SplashActivity"
        android:exported="true"
        android:theme="@style/Theme.YourApp.Starting">  
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
    
	...
</application>

 

 

4. Splash 초기화하기

이제 코드에서 Splash를 초기화 해주면 됩니다.

 

최초에 한번 onCreate에서,

SplashScreen을 초기화 해 주기만 하면 됩니다.

마지막 줄 코드는 SplashActivity내에서 하는 다른 로직들이 끝날때까지,
스플래시 화면을 유지하는데 쓰입니다.

 

override fun onCreate(savedInstanceState: Bundle?) {
    // 스플래시 스크린 초기화 (새로 추가)
    val splashScreen = installSplashScreen()

    // 다른 로직이 완료될 때까지 스플래시 화면 유지
    splashScreen.setKeepOnScreenCondition { true }

    super.onCreate(savedInstanceState)
}

 

 

위는 Kotlin코드 였고요.

java로는 아래와 같습니다.

 

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        SplashScreen splashScreen = SplashScreen.installSplashScreen(this);
        splashScreen.setKeepOnScreenCondition(() -> true);
}

 

 

이렇게 하고 앱을 실행시키면,

새로운 Android Splash Screen이 적용된 화면을 볼 수 있습니다.