الإعداد اليدوي للشاشة الممتدة من الحافة إلى الحافة

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

تنسيق تطبيقك بملء الشاشة

استخدِم WindowCompat.setDecorFitsSystemWindows(window, false) لتصميم تطبيقك خلف أشرطة النظام، كما هو موضّح في مثال الرمز التالي:

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  WindowCompat.setDecorFitsSystemWindows(window, false)
}

Java

@Override
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  WindowCompat.setDecorFitsSystemWindows(getWindow(), false);
}

تغيير لون أشرطة النظام

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

  • وضع التنقّل بالإيماءات: يطبّق النظام ميزة "تكييف الألوان الديناميكي"، حيث يتغيّر لون محتوى أشرطة النظام استنادًا إلى المحتوى الذي يظهر خلفها. في المثال التالي، يتغيّر لون المقبض في شريط التنقّل إلى لون داكن عندما يكون فوق محتوى فاتح، وإلى لون فاتح عندما يكون فوق محتوى داكن.
الشكل 1. تغييرات الألوان في وضع التنقّل بالإيماءات
  • وضع الزر: يطبّق النظام طبقة تعتيم شفافة خلف أشرطة النظام (في المستوى 29 من واجهة برمجة التطبيقات أو الإصدارات الأحدث) أو شريط نظام شفاف (في المستوى 28 من واجهة برمجة التطبيقات أو الإصدارات الأقدم).
صورة تعرض أشرطة نظام شفافة
الشكل 2. حاجب شفاف خلف أشرطة النظام
  • لون محتوى شريط الحالة: يتحكّم في لون محتوى شريط الحالة، مثل الوقت والرموز.
صورة تعرض لون محتوى شريط الحالة
الشكل 3. لون محتوى شريط الحالة

يمكنك تعديل ملف themes.xml لضبط لون شريط التنقّل، ويمكنك أيضًا ضبط شريط الحالة ليكون شفافًا وضبط لون محتوى شريط الحالة ليكون داكنًا.

<!-- values-v29/themes.xml -->
<style name="Theme.MyApp">
  <item name="android:navigationBarColor">
     @android:color/transparent
  </item>

  <!-- Optional: set to transparent if your app is drawing behind the status bar. -->
  <item name="android:statusBarColor">
     @android:color/transparent
  </item>

  <!-- Optional: set for a light status bar with dark content. -->
  <item name="android:windowLightStatusBar">
    true
  </item>
</style>

يمكنك استخدام واجهة برمجة التطبيقات WindowInsetsController مباشرةً، ولكن ننصحك بشدة باستخدام مكتبة الدعم WindowInsetsControllerCompat حيثما أمكن ذلك. يمكنك استخدام واجهة برمجة التطبيقات WindowInsetsControllerCompat بدلاً من theme.xml للتحكّم في لون محتوى شريط الحالة. لإجراء ذلك، استخدِم الدالة setAppearanceLightNavigationBars() مع تمرير true لتغيير لون المقدّمة في شريط التنقّل إلى لون فاتح أو false للرجوع إلى اللون التلقائي.

Kotlin

val windowInsetsController =
      ViewCompat.getWindowInsetsController(window.decorView)

windowInsetsController?.isAppearanceLightNavigationBars = true

Java

WindowInsetsControllerCompat windowInsetsController =
      ViewCompat.getWindowInsetsController(getWindow().getDecorView());
if (windowInsetsController == null) {
    return;
}

windowInsetsController.setAppearanceLightNavigationBars(true);