הוספת מסך פתיחה

מילות מפתח: splashscreen

אם האפליקציה שלכם מיישמת מסך פתיחה מותאם אישית או משתמשת בנושא של מרכז האפליקציות, עליכם להעביר את האפליקציה לספרייה SplashScreen שזמינה ב-Jetpack כדי לוודא שהיא תוצג בצורה תקינה בכל הגרסאות של Wear OS.

בדף הזה מפורטות הוראות מפורטות להטמעה של מסך הפתיחה באמצעות הספרייה SplashScreen, כך שהמסך יעמוד בהנחיות העיצוב.

הוספת יחסי תלות

מוסיפים את יחסי התלות הבאים לקובץ build.gradle של מודול האפליקציה:

מגניב

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

Kotlin

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

כדי לקבל תמיכה במאפייני ברירת המחדל של Wear OS, צריך לוודא שאתם משתמשים בגרסה 1.0.1 ואילך.

הוסף עיצוב

יוצרים עיצוב של מסך פתיחה ב-res/values/styles.xml. רכיב ההורה תלוי בצורתו של הסמל:

  • אם הסמל עגול, משתמשים ב-Theme.SplashScreen.
  • אם הסמל הוא בצורה אחרת, משתמשים ב-Theme.SplashScreen.IconBackground.

משתמשים ב-windowSplashScreenBackground כדי למלא את הרקע בצבע שחור אחד. מגדירים את הערכים של postSplashScreenTheme לנושא שבו צריך להשתמש ב-Activity, ואת הערך של windowSplashScreenAnimatedIcon ל-drawable או ל-drawable מונפש:

<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>

אם משתמשים בסמל לא עגול, צריך להגדיר צבע רקע לבן מתחת לסמל. במקרה כזה, משתמשים ב-Theme.SplashScreen.IconBackground בתור נושא הורה ומגדירים את המאפיין 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>

שאר המאפיינים הם אופציונליים.

יצירת קובץ drawable לעיצוב

כדי להשתמש בעיצובים של מסכי פתיחה, צריך להעביר פריט גרפי שניתן לשרטוט למאפיין windowSplashScreenAnimatedIcon. לדוגמה, אפשר ליצור אותו על ידי הוספת קובץ חדש res/drawable/splash_screen.xml ושימוש בסמל של מרכז האפליקציות ובגודל הנכון של סמל מסך הפתיחה:

<?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>

גודל הסמל במסך הפתיחה מוגדר ב-res/values/dimens.xml, והוא משתנה בהתאם לכך שהסמל עגול:

<?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>

...או לא עגולים, ולכן צריך להשתמש ברקע הסמל:

<?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>

ציון העיצוב

בקובץ המניפסט של האפליקציה (AndroidManifest.xml), מחליפים את העיצוב של הפעילות המתחילה – בדרך כלל אלה שמגדירים פריט במרכז האפליקציות או מיוצאים בדרך אחרת – בעיצוב שיצרתם בשלב הקודם:

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

עדכון הפעילות ההתחלתית

לפני שמפעילים את super.onCreate(), צריך להתקין את מסך הפתיחה בפעילות ההתחלה:

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

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

מקורות מידע נוספים

מידע נוסף על מסכי פתיחה באופן כללי ועל האופן שבו אפשר להשתמש בהם באפליקציה