يُطلق على شريط الحالة وشريط التنقّل معًا اسم أشرطة النظام. وهي تعرض معلومات مهمة مثل مستوى البطارية والوقت وتنبيهات الإشعارات، وتوفّر تفاعلاً مباشرًا مع الجهاز من أي مكان.
من الأهمية بمكان أخذ بروز أشرطة النظام في الاعتبار، سواء كنت تصمم واجهة المستخدم للتفاعل مع نظام التشغيل Android أو طرق الإدخال أو إمكانيات الجهاز الأخرى. اجعل أشرطة النظام في الجزء العلوي من معظم الطبقات للتأكد من حسابها.
الخلاصات
قم بتضمين أشرطة النظام في تصميماتك لحساب المناطق الآمنة لواجهة المستخدم وتفاعلات النظام وطرق الإدخال ومقاطع العرض وإمكانيات الجهاز الأخرى. اجعل أشرطة النظام في الطبقة العلوية لتضمن حسابها.
يجب تنفيذ ما يلي: اجعل أشرطة النظام شفافة واعرض تطبيقك بملء الشاشة، واستمرار واجهة المستخدم تحت الأشرطة لمنح تجربة شاملة.
إذا لم تتمكّن من ضبط كلا الشريطَين ليكونا شفافَين، تأكَّد من أنّ ألوان الأشرطة تتطابق مع لون نص تطبيقك. على سبيل المثال، يمكنك مطابقة لون شريط التنقّل السفلي مع لون شريط الإيماءات، ولون شريط الحالة العلوي مع لون النص الأساسي.
الشكل 2: التأكّد من تطابق ألوان شريط النظام مع لون النص الأساسي في تطبيقك تجنَّب إضافة إيماءات النقر أو اسحب الأهداف ضمن المواضع الداخلية للإيماءات، إذ تتعارض هذه الميزات مع التنقّل من الحافة إلى الحافة والتنقل بالإيماءات.
الشكل 3: إدخالات إيماءة النظام. تجنَّب وضع أهداف النقر تحت هذه المناطق.
رسم المحتوى خلف أشرطة النظام
تسمح الميزة الشاملة لنظام التشغيل Android برسم واجهة المستخدم أسفل أشرطة النظام للحصول على تجربة غامرة أكثر. نوصي باستخدام شامل لأن جعل شريط التنقل شفافًا هو طلب شائع من المستخدمين. (تعرّف على طريقة دعم الحرص الكامل).
يمكن للتطبيق معالجة التداخلات في المحتوى من خلال التفاعل مع عمليات التثبيت. توضّح المساحات الداخلية مقدار المحتوى الذي يجب ملؤها في تطبيقك لتجنُّب تداخله مع أجزاء من واجهة مستخدم نظام التشغيل Android، مثل شريط التنقل أو شريط الحالة، أو مع ميزات الجهاز الفعلية مثل قطع الشاشة.
كن على دراية بالأنواع التالية من العناصر الداخلية عند التصميم لحالات الاستخدام الشاملة:
- تنطبق المساحات الداخلية لأشرطة النظام على واجهة المستخدم القابلة للنقر والتي يجب ألا تحجبها أشرطة النظام بشكل مرئي.
- تنطبق العناصر الداخلية لإيماءات النظام على مناطق التنقّل بالإيماءات التي يستخدمها النظام التي لها الأولوية على تطبيقك.
شريط الحالة
في نظام التشغيل Android، يحتوي شريط الحالة على رموز الإشعارات ورموز النظام. يتفاعل المستخدم مع شريط الحالة بسحبه لأسفل للوصول إلى مركز الإشعارات.
يمكن أن يظهر شريط الحالة بشكل مختلف بناءً على السياق والوقت من اليوم والإعدادات المفضّلة أو المظاهر التي يضبطها المستخدم والمَعلمات الأخرى. يمكنك أيضًا تعيين نمط شريط الحالة، كما في الأمثلة التالية.
عندما يصل إشعار، يظهر رمز عادةً في شريط الحالة. تشير هذه الإشارة إلى المستخدم بأن هناك محتوى يمكن ملاحظته في درج الإشعارات. يمكن أن يكون رمز التطبيق أو الرمز لتمثيل القناة. راجع تصميم الإشعارات.
ضبط نمط شريط الحالة
يمكنك اختيار تصميم خلفية شريط الحالة كجزء من مظهر التطبيق، واستخدام لون أو نمط مخصّص، مع ضبط الشفافية والتعتيم.
<style name="Theme.MyApp">
<item name="android:statusBarColor">
@android:color/transparent
</item>
</style>
إذا كنت تضبط لون الخلفية يدويًا، يمكنك اختيار تصميم محتوى شريط الحالة باللون الفاتح أو الداكن للحصول على أفضل تباين.
عرض القواطع وشريط الحالة
القطْع على الشاشة هو مساحة في بعض الأجهزة تمتد إلى سطح الشاشة لتوفير مساحة لأجهزة الاستشعار الأمامية. يمكن أن يؤثر على ظهور أشرطة الحالة. قد تختلف أشكال الشاشة حسب الشركة المصنّعة.
يمكنك الاطّلاع على طريقة إتاحة استخدام خطوط العرض.
شريط التنقل
يتيح Android للمستخدمين التحكّم في التنقّل باستخدام عناصر التحكّم في الرجوع والشاشة الرئيسية والنظرة العامة:
- يؤدي الزر "رجوع" إلى الرجوع مباشرةً إلى العرض السابق.
- يؤدي النقر على الشاشة الرئيسية إلى الخروج من التطبيق وإلى الشاشة الرئيسية للجهاز.
- تعرِض بطاقة "نظرة عامة" التطبيقات مفتوحة وتمّ فتحها مؤخّرًا.
يمكن للمستخدمين الاختيار من بين تكوينات شريط التنقل المختلفة بما في ذلك التنقل بالإيماءات (مُوصى به) والتنقل باستخدام ثلاثة أزرار.
التنقل بالإيماءات
تم طرح ميزة التنقّل بالإيماءات في نظام التشغيل Android 10 (المستوى 29 من واجهة برمجة التطبيقات)، وهي نوع ننصح به للتنقّل، على الرغم من أنّه لا يمكنك إلغاء الخيار المفضّل لدى المستخدم. لا يستخدم التنقل بالإيماءات أزرارًا للرجوع والشاشة الرئيسية ونظرة عامة، بدلاً من إظهار مقبض إيماءة واحد للتحكم. يتفاعل المستخدمون عن طريق التمرير السريع من الحافة اليسرى أو اليمنى للشاشة للعودة وللأمام وللأعلى من الأسفل للانتقال إلى الصفحة الرئيسية. يؤدي التمرير سريعًا للأعلى مع الاستمرار إلى فتح النظرة العامة.
يعد التنقل بالإيماءات نمط تنقل أكثر قابلية للتوسع للتصميم عبر الهاتف المحمول والشاشات الأكبر. لتوفير أفضل تجربة للمستخدم، عليك مراعاة التنقل بالإيماءات من خلال:
- دعم المحتوى الشامل
- تجنَّب إضافة تفاعلات أو مساحات لمس ضمن أجزاء التنقّل بالإيماءات.
يمكنك الاطّلاع على تنفيذ التنقّل بالإيماءات.
التنقّل باستخدام ثلاثة أزرار
يوفر التنقل باستخدام ثلاثة أزرار ثلاثة أزرار للرجوع والشاشة الرئيسية والنظرة العامة.
الأشكال الأخرى لشريط التنقل
بناءً على إصدار Android والجهاز، قد تتوفّر إعدادات شريط التنقّل الأخرى للمستخدمين. على سبيل المثال، يوفر التنقل باستخدام زرين زرين للصفحة الرئيسية وللرجوع.
ضبط نمط تنقل
يوضح المثال التالي كيفية تنفيذ نمط تنقل.
<style name="Theme.MyApp">
<item name="android:navigationBarColor">
@android:color/transparent
</item>
</style>
يتعامل Android مع جميع إجراءات الحماية المرئية لواجهة المستخدم في وضع التنقّل بالإيماءات أو في أوضاع الأزرار.
وضع التنقل بالإيماءات: يطبّق النظام ضبط الألوان الديناميكي، حيث يتغيّر لون محتوى أشرطة النظام بناءً على المحتوى خلفها. في المثال التالي، يتغير المقبض في شريط التنقل إلى لون داكن إذا تم وضعه أعلى المحتوى الفاتح، والعكس صحيح.
الشكل 15: تعديل الألوان الديناميكي أوضاع الأزرار: يطبّق النظام غطاءً شفافًا خلف أشرطة النظام (لالمستوى 29 أو أعلى لواجهة برمجة التطبيقات) أو شريط نظام شفاف (لمستوى واجهة برمجة التطبيقات 28 أو أقل).
الشكل 16: تعديل الألوان الديناميكي، حيث تغيّر أشرطة النظام لونها بناءً على المحتوى
لوحة المفاتيح والتنقل
يتفاعل كل نوع من أنواع التنقّل بشكل مناسب مع لوحة المفاتيح على الشاشة للسماح للمستخدم بتنفيذ إجراءات مثل إغلاق نوع لوحة المفاتيح أو حتى تغييره. لضمان انتقال سلِس باستخدام لوحة المفاتيح، استخدِم
WindowInsetsAnimationCompat لضمان نقل البيانات بسلاسة أثناء مزامنة عملية انتقال التطبيق مع تمرير لوحة المفاتيح
من أسفل الشاشة إلى أعلاها وأسفلها.
الوضع المجسَّم
يمكنك إخفاء أشرطة النظام عندما تحتاج إلى تجربة بملء الشاشة، على سبيل المثال عندما يشاهد المستخدم فيلمًا. يجب أن يظل المستخدم قادرًا على النقر للكشف عن أشرطة النظام وواجهة المستخدم من أجل التنقل أو التفاعل مع عناصر تحكم النظام. يمكنك الاطّلاع على مزيد من المعلومات حول التصميم للتوافق مع أوضاع ملء الشاشة، أو الاطّلاع على كيفية إخفاء أشرطة النظام للوضع المجسَّم.