إضافة شاشة بداية

إذا كان تطبيقك ينفّذ شاشة تمهيدية مخصّصة أو يستخدم مظهرًا للمشغّل، عليك نقل تطبيقك إلى مكتبة SplashScreen المتوفّرة في Jetpack لضمان عرضها بشكل صحيح على جميع إصدارات Wear OS.

يمكنك الاطّلاع على تعليمات التنفيذ المفصّلة في هذه الصفحة لمعرفة كيفية إضافة شاشة البداية باستخدام مكتبة SplashScreen، وذلك لكي تتوافق الشاشة مع إرشادات التصميم.

إضافة عناصر تابعة

أضِف التبعية التالية إلى ملف build.gradle الخاص بوحدة تطبيقك:

رائع

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

Kotlin

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

تأكَّد من استخدام الإصدار 1.0.1 أو إصدار أحدث للاستفادة من دعم سمات Wear OS التلقائية.

إضافة مظهر

أنشئ مظهرًا لشاشة البداية في res/values/styles.xml. يعتمد العنصر الرئيسي على شكل الرمز:

  • إذا كان الرمز دائريًا، استخدِم Theme.SplashScreen.
  • إذا كان الرمز شكلًا مختلفًا، استخدِم Theme.SplashScreen.IconBackground.

استخدِم windowSplashScreenBackground لملء الخلفية بلون أسود واحد. اضبط قيم postSplashScreenTheme على المظهر الذي يجب أن تستخدمه Activity، واضبط windowSplashScreenAnimatedIcon على عنصر قابل للرسم أو عنصر قابل للرسم متحرك:

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

أما السمات الأخرى، فهي اختيارية.

إنشاء عنصر قابل للرسم للمظهر

تتطلّب سمات شاشة البداية توفير عنصر قابل للرسم لتمريره إلى السمة 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")
        }
    }
}

مراجع إضافية

مزيد من المعلومات حول شاشات البداية بشكل عام وكيفية استخدامها في تطبيقك