تنفيذ المظهر الداكن

تجربة طريقة ComposeAllowed

Jetpack Compose هي مجموعة أدوات واجهة المستخدم التي ننصح بها لنظام التشغيل Android. تعرَّف على كيفية التعامل معها في Compose.

نظام الألوان - التصميم المتعدد الأبعاد 3 →

الشكل 1. المظهر الداكن.

يتوفّر "المظهر الداكن" في الإصدار 10 من نظام التشغيل Android (المستوى 29 من واجهة برمجة التطبيقات) والإصدارات الأحدث. تحتوي على الفوائد التالية:

• يقلل هذا الخيار من استخدام الطاقة بمقدار كبير حسب درجة حرارة الجهاز تقنية الشاشة.
• تحسين مستوى الرؤية للمستخدمين الذين يعانون من ضعف في النظر والذين لديهم حساسية terhadap الضوء الساطع
• تسهيل استخدام الجهاز في بيئة ذات إضاءة منخفضة

ينطبق "المظهر الداكن" على واجهة مستخدم نظام Android والتطبيقات التي تعمل على الجهاز.

هناك ثلاث طرق لتفعيل المظهر الداكن في الإصدار 10 من نظام التشغيل Android والإصدارات الأحدث:

• يمكنك استخدام إعدادات النظام من خلال الانتقال إلى الإعدادات > الشاشة > المظهر ل activation وتفعيل المظهر الداكن.
• استخدِم مربّع "الإعدادات السريعة" للتبديل بين المظاهر من علبة الإشعارات، عند تفعيلها.
• على أجهزة Pixel، فعِّل وضع "توفير شحن البطارية" لتفعيل المظهر الداكن في الوقت نفسه. قد لا تتوافق الأجهزة الأخرى مع هذا السلوك.

للحصول على تعليمات حول كيفية تطبيق مظهر داكن على محتوى مستند إلى الويب باستخدام WebView راجِع تعتيم محتوى الويب في WebView.

إتاحة المظهر الداكن في تطبيقك

لإتاحة المظهر الداكن، يجب ضبط مظهر التطبيق الذي يمكن العثور عليه عادةً في res/values/styles.xml: ولاكتسابها من مظهر DayNight:

<style name="AppTheme" parent="Theme.AppCompat.DayNight">

يمكنك أيضًا استخدام مكوّنات Material Components داكنة المظهر:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">

يربط ذلك الموضوع الرئيسي للتطبيق بعلامات الوضع الليلي التي يتحكم فيها النظام إلى التطبيق مظهرًا داكنًا تلقائيًا عند تفعيله.

المظاهر والأنماط

تجنَّب استخدام الألوان أو الرموز الثابتة المخصّصة للاستخدام مع مظاهر فاتحة. استخدِم سمات المظهر أو الموارد المؤهَّلة للعرض في الليل بدلاً من ذلك.

السمتان الأكثر أهمية للمظهر الداكن هو الأكثر أهمية:

• ‫?android:attr/textColorPrimary: لون نص لأغراض عامة من المهم مظهر شبه أسود في مظهر فاتح وأبيض شبه غامق في مظاهر داكنة. ويشتمل على غير مفعّل.
• ‫?attr/colorControlNormal: لون رمز لأغراض عامة يحتوي على حالة متوقفة.

ننصحك باستخدام مكونات Material Design ، لأنّ نظام تنسيق الألوان ، مثل سمتَي ?attr/colorSurface و?attr/colorOnSurface، يتيح الوصول بسهولة إلى الألوان المناسبة. يمكنك تخصيص هذه السمات في المظهر.

تغيير المظاهر داخل التطبيق

يمكنك السماح للمستخدمين بتغيير مظهر التطبيق أثناء تشغيله. ما يلي: الخيارات المقترَحة:

• فاتح
• داكن
• الإعداد التلقائي للنظام (الخيار التلقائي المُقترَح)

يتم ربط هذه الخيارات مباشرةً بأوضاع AppCompat.DayNight:

• ضوء: MODE_NIGHT_NO

• داكن: MODE_NIGHT_YES

• الإعداد التلقائي للنظام: MODE_NIGHT_FOLLOW_SYSTEM.

لتبديل المظهر، اتّبِع الخطوات التالية:

• في المستوى 31 من واجهة برمجة التطبيقات والإصدارات الأحدث، استخدِم ‎ UiModeManager#setApplicationNightMode للسماح للنظام بمعرفة المظهر الذي يستخدمه تطبيقك. يتيح ذلك للنظام مطابقة المظهر أثناء ظهور شاشة البداية.

• في المستوى 30 من واجهة برمجة التطبيقات والإصدارات الأقدم، استخدِم رمز AppCompatDelegate.setDefaultNightMode() لتبديل المظهر.

ملاحظة: بدءًا من الإصدار AppCompat 1.1.0، يتم تشغيل setDefaultNightMode() تلقائيًا ويعيد إنشاء أي أنشطة بدأتها.

فرض المظهر الداكن

يقدّم نظام Android 10 ميزة فرض المظهر الداكن، وهي ميزة تتيح للمطوّرين تنفيذ المظهر الداكن بسرعة بدون ضبط مظهر DayNight بشكل صريح.

تحلِّل ميزة "فرض داكن" كل طريقة عرض لتطبيقك الذي يتناول المظهر الفاتح وتطبّق مظهرًا داكنًا. تلقائيًا قبل أن يتم رسمه على الشاشة. يمكنك استخدام مزيج من Force Dark والتنفيذ الأصلي لتقليل الوقت اللازم لتنفيذ المهام الموضوع.

يجب أن توافق التطبيقات على ميزة "فرض المظهر الداكن" من خلال ضبط android:forceDarkAllowed="true" في مظهر النشاط. يتم ضبط هذه السمة على جميع المظاهر الفاتحة التي يوفّرها النظام و AndroidX، مثل Theme.Material.Light. عند استخدام افرض المظهر الداكن، واختبِر تطبيقك بدقة، واستبعد المشاهدات حسب الحاجة.

إذا كان تطبيقك يستخدم مظهرًا داكنًا، مثل Theme.Material)، لن يتم تطبيق وضع "فرض المظهر الداكن". وبالمثل، إذا كان مظهر تطبيقك يرث مظهرًا من DayNight، لن يتم تطبيق وضع Forced Dark بسبب التبديل التلقائي للمظهر.

إيقاف ميزة "فرض الوضع الداكن" في عرض

يمكن التحكّم في ميزة "فرض الوضع الداكن" في طرق عرض معيّنة باستخدام سمة android:forceDarkAllowed layout أو باستخدام setForceDarkAllowed().

محتوى على الويب

للحصول على معلومات عن استخدام المظاهر الداكنة في المحتوى المستند إلى الويب، يُرجى الاطّلاع على مقالة تعتيم محتوى الويب في WebView. للحصول على مثال على المظهر الداكن المُطبَّق على WebView، اطّلِع على العرض التجريبي لـ WebView على GitHub .

أفضل الممارسات

توفّر الأقسام التالية أفضل الممارسات لاستخدام المظاهر الداكنة.

الإشعارات والتطبيقات المصغّرة

بالنسبة إلى مساحات عرض واجهة المستخدم التي تعرِضها على الجهاز ولكن لا تتحكم فيها مباشرةً، تأكَّد من أنّ أيّ طرق عرض تستخدمها تعكس موضوع التطبيق المضيف. مثالان هما والإشعارات والتطبيقات المصغّرة في مشغّل التطبيقات.

الإشعارات

استخدِم نماذج الإشعارات التي يوفّرها النظام، مثل MessagingStyle. هذا النمط تعني أنّ النظام مسؤول عن تطبيق نمط العرض الصحيح.

التطبيقات المصغّرة وطرق عرض الإشعارات المخصّصة

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

تشمل المخاطر الشائعة التي يجب الانتباه إليها ما يلي:

• بافتراض أنّ لون الخلفية فاتح دائمًا.
• ترميز ألوان النصوص بشكل ثابت
• ضبط لون خلفية مُبرمَج أثناء استخدام لون النص التلقائي
• استخدام رمز قابل للرسم بلون ثابت

في كل هذه الحالات، استخدِم سمات المظهر المناسبة بدلاً من الألوان المبرمَجة.

شاشات الإطلاق

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

أزِل أي ألوان برمجية مثل ألوان الخلفية التي تم ضبطها آليًا على الأبيض. استخدِم سمة المظهر ?android:attr/colorBackground بدلاً من ذلك.

ملاحظة: لا تعمل عناصر android:windowBackground ذات المظهر الداكن إلا على Android 10.

تغييرات الإعدادات

عند تغيير مظهر التطبيق، إما من خلال إعدادات النظام أو من خلال AppCompat، يؤدي ذلك إلى تغيير في الإعدادات uiMode . وهذا يعني أنّه تتم إعادة إنشاء الأنشطة تلقائيًا.

في بعض الحالات، قد ترغب في أن يتعامل أحد التطبيقات مع تغيير الضبط. بالنسبة على سبيل المثال، قد ترغب في تأجيل تغيير التهيئة لأن الفيديو اللعب.

يمكن للتطبيق تنفيذ المظهر الداكن من خلال الإفصاح عن أنّ كل Activity يمكنه تنفيذ تغيير الإعدادات uiMode:

<activity
    android:name=".MyActivity"
    android:configChanges="uiMode" />

عندما يُعلن Activity أنّه يعالج تغييرات الإعدادات، يتمّ استدعاء أسلوبه onConfigurationChanged() عند حدوث تغيير في المظهر.

للتحقّق من المظهر الحالي، يمكن للتطبيقات تشغيل رموز برمجية على النحو التالي:

KotlinJava

val currentNightMode = configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK
when (currentNightMode) {
    Configuration.UI_MODE_NIGHT_NO -> {} // Night mode is not active, we're using the light theme.
    Configuration.UI_MODE_NIGHT_YES -> {} // Night mode is active, we're using dark theme.
}

int currentNightMode = configuration.uiMode & Configuration.UI_MODE_NIGHT_MASK;
switch (currentNightMode) {
    case Configuration.UI_MODE_NIGHT_NO:
        // Night mode is not active, we're using the light theme
        break;
    case Configuration.UI_MODE_NIGHT_YES:
        // Night mode is active, we're using dark theme
        break;
}

ملاحظة: لمزيد من المعلومات حول تغييرات الضبط، كيفية حظر "النشاط" إذا لزم الأمر، وكيفية التفاعل مع تغييرات التهيئة هذه من عرض النظام وJetpack Compose، صفحة التعامل مع تغييرات الإعدادات