شريط الحالة وشريط العنوان وشريط التنقّل هي أشرطة النظام. تعرض هذه الإشعارات معلومات مهمة، مثل مستوى البطارية والوقت وتنبيهات الإشعارات، وتتيح التفاعل المباشر مع الجهاز من أي مكان.
عليك دائمًا مراعاة ظهور أشرطة النظام وأهميتها، سواء كنت تصمّم تخطيطات أو طرق إدخال أو غير ذلك من إمكانات الجهاز.
مهارات Android
عرض على GitHubإضافة ميزة "من الحافة إلى الحافة"
android skills add edge-to-edge
الخلاصات
ضمِّن أشرطة النظام في تخطيطاتك لأحجام الشاشات وأشكال الأجهزة المختلفة. يجب مراعاة مناطق الأمان في واجهة المستخدم وتفاعلات النظام وطرق الإدخال وفتحات الشاشة وأشرطة الحالة وأشرطة العناوين وأشرطة التنقّل وإمكانات الأجهزة الأخرى.
اجعل شريطَي الحالة والتنقّل شفافَين أو شبه شفافَين، وارسم المحتوى خلف هذين الشريطَين لملء الشاشة من الحافة إلى الحافة.
استخدِم
WindowInsetsللتعامل بشكل صحيح مع حالات التداخل مع شريط النظام والتأكّد من عدم حجب المحتوى في التصاميم التكيّفية.استخدِم التنسيقات الأساسية التي تستخدم مساحة الشاشة بكفاءة.
شريط الحالة
يحتوي شريط الحالة على رموز الإشعارات ورموز النظام. يتفاعل المستخدم مع شريط الحالة من خلال سحبه للأسفل للوصول إلى مركز الإشعارات. يمكن أن تكون أنماط شريط الحالة شفافة أو شبه شفافة.
رموز شريط الحالة
يمكن أن تظهر رموز شريط الحالة بشكل مختلف حسب السياق أو الوقت من اليوم أو الإعدادات المفضّلة أو المظاهر التي يضبطها المستخدم أو غير ذلك من المَعلمات. لمزيد من المعلومات، يُرجى الاطّلاع على رموز شريط النظام.
عند وصول إشعار، يظهر رمز عادةً في شريط الحالة. ويشير ذلك إلى المستخدم بأنّه يتوفّر محتوى جديد في درج الإشعارات. يمكن أن يكون هذا الرمز هو رمز تطبيقك أو رمزًا يمثّل القناة. اطّلِع على تصميم الإشعارات.
ضبط نمط شريط الحالة
اجعل شريط الحالة شفافًا أو شبه شفاف لضمان أن يغطي محتوى تطبيقك الشاشة بأكملها. بعد ذلك، اضبط نمط رموز شريط النظام لكي تتضمّن الرموز تباينًا مناسبًا.
يتم فرض استخدام ميزة "العرض حتى حافة الشاشة" في Android 15، ما يجعل شريط الحالة شفافًا بشكل تلقائي. استدعِ الدالة enableEdgeToEdge() للتوافق مع الأنظمة القديمة.
في الصورة التالية على اليمين، شريط الحالة شفاف ويتم عرض خلفية TopAppBar الخضراء خلف شريط الحالة.
تكون أشرطة الحالة الشفافة مثالية عندما لا تظهر واجهة المستخدم أسفل شريط الحالة أو عندما يتم رسم صورة أسفل شريط الحالة. تكون أشرطة الحالة الشفافة مثالية عندما تنتقل واجهة المستخدم للأسفل تحت شريط الحالة. لمزيد من المعلومات حول حماية التدرّج، يُرجى الاطّلاع على التصميم من الحافة إلى الحافة.
التنقل
يتيح نظام التشغيل Android للمستخدمين التحكّم في التنقّل باستخدام عناصر التحكّم في الرجوع والشاشة الرئيسية والنظرة العامة:
- يؤدي النقر على "رجوع" إلى العودة إلى طريقة العرض السابقة.
- يتم الانتقال من التطبيق إلى الشاشة الرئيسية للجهاز.
- تعرض النظرة العامة التطبيقات النشطة والتطبيقات الأخيرة التي لم يتم إغلاقها.
يمكن للمستخدمين الاختيار من بين إعدادات مختلفة للتنقّل، بما في ذلك التنقّل بالإيماءات والتنقّل التكيّفي. لتقديم أفضل تجربة للمستخدم، يجب مراعاة أنواع التنقّل المتعددة.
التنقل بالإيماءات
لا تستخدم ميزة "التنقّل بالإيماءات" أزرارًا للرجوع إلى الشاشة السابقة والانتقال إلى الشاشة الرئيسية وعرض النظرة العامة، بل تعرض بدلاً من ذلك أداة واحدة للتعرّف على الإيماءات. يتفاعل المستخدمون من خلال التمرير سريعًا من الحافة اليمنى أو اليسرى للشاشة للرجوع، ومن أسفل الشاشة إلى أعلاها للانتقال إلى الشاشة الرئيسية. يؤدي التمرير سريعًا للأعلى مع الاستمرار إلى فتح "النظرة العامة".
يُعدّ التنقّل بالإيماءات نمط تنقّل أكثر قابلية للتوسّع عند التصميم على الأجهزة الجوّالة والشاشات الأكبر حجمًا. لتقديم أفضل تجربة للمستخدم، يجب مراعاة التنقّل بالإيماءات من خلال اتّباع الخطوات التالية:
- توفير محتوى من الحافة إلى الحافة
- تجنَّب إضافة تفاعلات أو عناصر مستهدَفة باللمس ضمن هوامش التنقّل بالإيماءات.
لمزيد من المعلومات، يُرجى الاطّلاع على إضافة إمكانية استخدام ميزة "التنقّل بالإيماءات".
التنقل التكيّفي
من أنماط التنقّل الشائعة الأخرى على Android التبديل بين شريط التنقّل وقضيب التنقّل استنادًا إلى فئة حجم النافذة في الشاشة. تتعامل مكوّنات التنقّل التكيُّفي في Jetpack Compose مع أشكال أجهزة متعددة، مع الحفاظ على عدم تداخل أشرطة النظام مع تصميم مكوّنات التنقّل.
في التصاميم التكيُّفية، يجب مراعاة طريقة عمل أشرطة النظام أو تصميمها بشكل مختلف في سياقات متنوعة، مثل أحجام النوافذ المضغوطة أو الموسّعة أو أوضاع الأجهزة القابلة للطي المختلفة.
لمزيد من المعلومات، يُرجى الاطّلاع على إنشاء نظام تنقّل متكيّف.
رموز التنقّل
يمكن أن تظهر رموز التنقّل بشكل مختلف أيضًا حسب الإعدادات المفضّلة أو المظاهر التي يختارها المستخدم. لمزيد من المعلومات، يُرجى الاطّلاع على رموز شريط النظام.
ضبط نمط التنقّل
يتولّى نظام التشغيل Android جميع إجراءات الحماية المرئية لواجهة المستخدم في وضع التنقّل بالإيماءات ووضعَي الأزرار. يطبّق النظام ميزة "تكيُّف الألوان الديناميكي"، حيث يتغير لون محتوى أشرطة النظام استنادًا إلى المحتوى الموجود خلفها.
وضع التنقّل بالإيماءات
بعد استهداف الإصدار 15 من Android أو استدعاء enableEdgeToEdge في Activity، يرسم النظام شريط تنقّل شفافًا بالإيماءات ويطبّق ميزة "تكييف الألوان الديناميكي". في المثال التالي، يتغيّر لون المقبض في شريط التنقّل إلى لون داكن إذا تم وضعه فوق محتوى فاتح، والعكس صحيح.
ننصح دائمًا باستخدام أشرطة التنقّل بالإيماءات الشفافة.
إجراءات يُنصح بها
الإجراءات غير المُوصى بها
أوضاع الزر
بعد استهداف الإصدار 15 من نظام التشغيل Android أو استدعاء enableEdgeToEdge في Activity، يطبّق النظام حاجبًا شفافًا خلف أشرطة التنقّل التي تتضمّن أزرارًا، ويمكنك إزالة هذا الحاجب من خلال ضبط Window.setNavigationBarContrastEnforced() على "خطأ".
استخدِم أشرطة تنقّل شفافة بثلاثة أزرار عندما يكون هناك شريط تطبيق سفلي أو شريط تنقّل سفلي للتطبيق، أو عندما لا تتمرّر واجهة المستخدم تحت شريط التنقّل ذي الأزرار الثلاثة. للحصول على شريط تنقّل شفاف، اضبط قيمة
Window.setNavigationBarContrastEnforced() على false، واضبط مساحة متروكة في أسفل أشرطة التطبيق
للعرض أسفل أشرطة التنقّل في النظام، كما هو موضّح في الأشكال 7 و8 و9. لمزيد من المعلومات، يُرجى الاطّلاع على مقالة حماية شريط النظام.
استخدِم شريط تنقّل شبه شفاف بثلاثة أزرار لتصفّح المحتوى. لمزيد من المعلومات حول اعتبارات شريط التنقل الشفّاف، يمكنك الاطّلاع على التصميم من الحافة إلى الحافة.
لوحة المفاتيح والتنقل
يتفاعل كل نوع من أنواع التنقّل بشكل مناسب مع لوحة المفاتيح على الشاشة للسماح للمستخدم بتنفيذ إجراءات مثل إغلاق لوحة المفاتيح أو حتى تغيير نوعها. لضمان انتقال سلس يزامن انتقال التطبيق مع انزلاق لوحة المفاتيح للأعلى والأسفل من أسفل الشاشة، استخدِم WindowInsetsAnimationCompat.
التنسيقات
تعمل التنسيقات التكيّفية على تحسين المساحة المتاحة للعرض. وهي تنظّم واجهة مستخدم التطبيق من خلال نقل المحتوى إلى لوحات ثانوية أو ثالثية.
عند تصميم تخطيطات قابلة للتكيّف، يجب مراعاة كيفية تفاعل أشرطة النظام مع المحتوى. استخدِم WindowInsets للتأكّد من أنّ أشرطة النظام لا تحجب واجهة المستخدم على شاشات مثل الشاشات الكبيرة والأجهزة القابلة للطي ونوافذ التطبيقات في وضعَي النوافذ المتعدّدة والعرض في نافذة.
عند عرض تطبيقك من الحافة إلى الحافة، تأكَّد من أنّ واجهة مستخدم النظام لا تحجب المحتوى وعناصر التحكّم. على سبيل المثال، إذا كان شريط التنقل يغطي زرًا، قد لا يتمكّن المستخدم من النقر على الزر.
لمزيد من المعلومات، يُرجى الاطّلاع على التصاميم الأساسية.
فتحات الشاشة
صورة مقطوعة للشاشة هي مساحة على بعض الأجهزة تمتد إلى مساحة عرض لتوفير مساحة لأجهزة الاستشعار المواجهة للأمام. يمكن أن تختلف فتحات الشاشة حسب الشركة المصنّعة. يجب مراعاة كيفية تفاعل الفتحات على الشاشة مع المحتوى والاتجاه والعرض من الحافة إلى الحافة.
الوضع المجسم
يمكنك إخفاء أشرطة النظام عندما تحتاج إلى تجربة ملء الشاشة، مثلاً عندما يشاهد المستخدم فيلمًا. يجب أن يظل بإمكان المستخدم النقر لعرض أشرطة النظام والتنقّل أو التفاعل مع عناصر تحكّم النظام. لمزيد من المعلومات، يُرجى الاطّلاع على المحتوى التفاعلي وإخفاء أشرطة النظام في وضع التفاعل.