Android 12 - Splash Screens 알아보기

Splash Screen은 App이 처음 실행될 때, 로딩되는 화면을 가리기 위해 만드는 화면입니다.

Android 12 이전에는 개발자가 직접 페이지를 만들었지만, Android 12에서 동작하는 App은 기본적으로 Splash Screen을 보여주도록 변경되었습니다.

Splash Screens 동작 모습

아래는 Android Developer에서 가져온 Screen Splash의 동작 모습입니다.

splash screen gmail example

Splash Screens 구성

Splash screen composition

  • (1)은 vector drawable입니다. Animation을 적용할 수 있습니다. 기본으로 Launcher 아이콘으로 설정되어있습니다.
  • (2)는 Icon background color이며, 설정하지 않으면 (1)의 이미지만 보입니다.
  • (4)는 background이며, 색상을 지정할 수 있습니다. 기본으로 아무 색도 설정되어있지 않습니다.

Splash Screens 커스텀

/res/values/themes/themes.xml에서 Theme의 style에 다음과 같이 리소스를 변경하여 커스텀할 수 있습니다.

<resources xmlns:tools="http://schemas.android.com/tools">
    <style name="Theme.SplashScreen" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        ...

        <item name="android:windowSplashScreenBackground">#808080</item>
        <item name="android:windowSplashScreenAnimatedIcon">@drawable/ic_launcher_foreground</item>
        <item name="android:windowSplashScreenIconBackgroundColor">@color/black</item>
        <item name="android:windowSplashScreenBrandingImage">@drawable/branding</item>
    </style>
</resources>
  • windowSplashScreenBackground : Background color에 대한 속성입니다.
  • windowSplashScreenAnimatedIcon : Icon에 대한 속성입니다.
  • windowSplashScreenIconBackgroundColor : Icon의 Background color에 대한 속성입니다.
  • windowSplashScreenBrandingImage : Branding Image에 대한 속성입니다. Branding Image는 Splash screen 하단에 위치합니다.

위와 같이 리소스를 변경하여 실행하면 다음과 같은 화면이 보입니다. 하단에 보이는 Simple Branding 이미지가 Branding Image입니다. Splash screen custom example

더 오래 Splash Screen 화면 띄우기

네트워크 문제 등으로 초기화가 오래 걸리는 경우, 초기화가 완료될 때까지, Splash Screen 화면이 유지되도록 구현할 수 있습니다.

다음은 5초간 Splash Screen을 띄우는 예제입니다. isReady가 true가 될 때 Splash screen이 종료됩니다.

class MainActivity : AppCompatActivity() {
    var isReady = false

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)


        thread(start=true) {
            for (i in 1..5) {
                Thread.sleep(1000)
            }
            isReady = true
        }

        // 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 if the initial data is ready.
                    return if (isReady) {
                        // The content is ready; start drawing.
                        content.viewTreeObserver.removeOnPreDrawListener(this)
                        true
                    } else {
                        // The content is not ready; suspend.
                        false
                    }
                }
            }
        )

    }
}

참고

Loading script...

Related Posts

codechachaCopyright ©2019 codechacha