Thêm màn hình chờ

Từ khoá: màn hình chờ

Nếu ứng dụng của bạn triển khai màn hình chờ tuỳ chỉnh hoặc sử dụng giao diện trình chạy, hãy di chuyển ứng dụng sang thư viện SplashScreen có trong Jetpack để đảm bảo ứng dụng hiển thị chính xác trên mọi phiên bản Wear OS.

Hãy xem hướng dẫn triển khai từng bước trên trang này để tìm hiểu cách thêm màn hình chờ bằng cách sử dụng thư viện SplashScreen sao cho màn hình đáp ứng được nguyên tắc thiết kế.

Thêm phần phụ thuộc

Hãy thêm phần phụ thuộc sau đây vào tệp build.gradle của mô-đun ứng dụng:

Groovy

dependencies {
    implementation "androidx.core:core-splashscreen:1.2.0-alpha02"
}

Kotlin

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

Đảm bảo bạn đang sử dụng phiên bản 1.0.1 trở lên để được hỗ trợ cho các kích thước Wear OS mặc định.

Thêm giao diện

Tạo giao diện màn hình chờ trong res/values/styles.xml. Phần tử mẹ phụ thuộc vào hình dạng của biểu tượng:

  • Nếu biểu tượng hình tròn, hãy sử dụng Theme.SplashScreen.
  • Nếu biểu tượng có hình dạng khác, hãy sử dụng Theme.SplashScreen.IconBackground.

Dùng windowSplashScreenBackground để tô nền bằng một màu đen duy nhất. Đặt giá trị postSplashScreenTheme thành giao diện mà Hoạt động sẽ sử dụng và windowSplashScreenAnimatedIcon thành một đối tượng có thể vẽ hoặc đối tượng đồ hoạ động có thể vẽ:

<resources>
    <style name="Theme.App" parent="@android:style/Theme.DeviceDefault" />

    <style name="Theme.App.Starting" parent="Theme.SplashScreen">
        <!-- Set the splash screen background to black -->
        <item name="windowSplashScreenBackground">@android:color/black</item>
        <!-- Use windowSplashScreenAnimatedIcon to add a drawable or an animated
             drawable. -->
        <item name="windowSplashScreenAnimatedIcon">@drawable/splash_screen</item>
        <!-- Set the theme of the Activity that follows your splash screen. -->
        <item name="postSplashScreenTheme">@style/Theme.App</item>
    </style>
</resources>

Nếu sử dụng biểu tượng không phải là hình tròn, bạn cần đặt màu nền trắng bên dưới biểu tượng. Trong trường hợp này, hãy sử dụng Theme.SplashScreen.IconBackground làm giao diện chính và đặt thuộc tính windowSplashScreenIconBackgroundColor:

<style name="Theme.App.Starting" parent="Theme.SplashScreen.IconBackground">
    ...
    <!-- Set a white background behind the splash screen icon. -->
    <item name="windowSplashScreenIconBackgroundColor">@android:color/white</item>
</style>

Các thuộc tính khác là không bắt buộc.

Tạo đối tượng có thể vẽ cho giao diện

Giao diện màn hình chờ yêu cầu đối tượng có thể vẽ phải truyền vào thuộc tính windowSplashScreenAnimatedIcon. Ví dụ: bạn có thể tạo tệp này bằng cách thêm tệp mới res/drawable/splash_screen.xml và sử dụng biểu tượng trình chạy ứng dụng cũng như kích thước biểu tượng màn hình chờ chính xác:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:width="@dimen/splash_screen_icon_size"
        android:height="@dimen/splash_screen_icon_size"
        android:drawable="@mipmap/ic_launcher"
        android:gravity="center" />
</layer-list>

Kích thước biểu tượng màn hình chờ được xác định trong res/values/dimens.xml và khác nhau tuỳ thuộc vào việc biểu tượng tròn:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Round app icon can take all of default space -->
    <dimen name="splash_screen_icon_size">48dp</dimen>
</resources>

...hay không tròn, do đó, phải sử dụng nền biểu tượng:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Non-round icon with background must use reduced size to fit circle -->
    <dimen name="splash_screen_icon_size">36dp</dimen>
</resources>

Chỉ định giao diện

Trong tệp kê khai của ứng dụng (AndroidManifest.xml), hãy thay thế giao diện của hoạt động khởi động (thường là các giao diện xác định mục trình chạy hoặc được xuất) thành giao diện mà bạn đã tạo ở bước trước:

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

Cập nhật hoạt động khởi động

Cài đặt màn hình chờ trong hoạt động khởi động trước khi gọi super.onCreate():

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        // Handle the splash screen transition.
        installSplashScreen()

        super.onCreate(savedInstanceState)
        setContent {
            WearApp("Wear OS app")
        }
    }
}

Tài nguyên khác

Tìm hiểu thêm về màn hình chờ nói chung và cách sử dụng màn hình chờ trong ứng dụng.