الصورة المقطوعة للشاشة هي منطقة على بعض الأجهزة تمتد إلى سطح الشاشة. يتيح تجربة شاملة مع توفير مساحة للمستشعرات المهمة الموجودة في الجزء الأمامي من الجهاز.
يتوافق Android مع الصور المقطوعة للشاشة على الأجهزة التي تعمل بالإصدار 9 من نظام التشغيل Android (المستوى 28 من واجهة برمجة التطبيقات) والإصدارات الأحدث. ومع ذلك، يمكن للشركات المصنّعة للأجهزة أيضًا إتاحة صور مقطوعة للشاشة على الأجهزة التي تعمل بنظام التشغيل Android 8.1 أو الإصدارات الأقدم.
يوضّح هذا المستند طريقة التوافق مع الأجهزة التي بها قصاصات، بما في ذلك كيفية التعامل مع منطقة الاقتصاص، التي تعني المستطيل الممتد من الحافة إلى الحافة على سطح الشاشة الذي يحتوي على الصورة المقطوعة.
![صورة تعرض مثالاً على صورة مقطوعة لشاشة أعلى منتصف الشاشة](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-intro.png?authuser=6&hl=ar)
اختَر كيفية معالجة تطبيقك للمناطق المقطوعة.
إذا كنت لا تريد أن يتداخل المحتوى مع منطقة مقطوعة، يمكنك بشكل عام التأكّد من عدم تداخل المحتوى مع شريط الحالة وشريط التنقّل. إذا كنت تعرض الصورة المقطوعة في المنطقة المقطوعة، استخدِم
WindowInsetsCompat.getDisplayCutout()
لاسترداد عنصر DisplayCutout
الذي يحتوي على الأجزاء الداخلية الآمنة ومربّع الإحاطة لكل صورة مقطوعة. تتيح لك واجهات برمجة التطبيقات هذه التحقق مما إذا كان المحتوى الخاص بك يتداخل مع الصورة المقطوعة بحيث يمكنك تغيير موضعه إذا لزم الأمر.
يمكنك أيضًا تحديد ما إذا كان المحتوى معروضًا خلف منطقة الصورة المقطوعة. تتحكّم سمة تنسيق نافذة layoutInDisplayCutoutMode
في طريقة رسم المحتوى ضمن منطقة الصورة المقطوعة.
يمكنك ضبط layoutInDisplayCutoutMode
على إحدى القيم التالية:
LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT
: يظهر المحتوى في منطقة الصورة المقطوعة عندما يتم تضمين الصورة المقطوعة للشاشة في شريط النظام. وبخلاف ذلك، لن تتداخل النافذة مع الصورة المقطوعة للشاشة. على سبيل المثال، قد يتم عرض المحتوى في أشرطة أفقية عند عرضه في الوضع الأفقي. إذا كان تطبيقك يستهدِف الإصدار 35 من حزمة تطوير البرامج (SDK)، سيتم تفسير ذلك على أنّهALWAYS
للنوافذ غير العائمة.LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS
: يُسمح دائمًا بتوسيع المحتوى ليشمل المناطق المقطوعة. إذا كان تطبيقك يستهدف الإصدار 35 من حزمة تطوير البرامج (SDK) ويعمل على جهاز Android 15، هذا هو الوضع الوحيد المسموح به للنوافذ غير العائمة لضمان عرض شاشة كاملة.LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
: يتم عرض المحتوى في منطقة الصورة المقطوعة بالوضعَين العمودي والأفقي. لا تستخدمه للنوافذ العائمة. إذا كان تطبيقك يستهدِف الإصدار 35 من حزمة تطوير البرامج (SDK)، سيتم تفسير ذلك على أنّهALWAYS
للنوافذ غير العائمة.LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
: لا يظهر المحتوى أبدًا في منطقة الصورة المقطوعة. إذا كان تطبيقك يستهدِف الإصدار 35 من حزمة تطوير البرامج (SDK)، سيتم تفسير ذلك على أنّهALWAYS
للنوافذ غير العائمة.
يمكنك ضبط وضع الصورة المقطوعة آليًا أو من خلال ضبط
نمط في نشاطك. يحدد المثال التالي نمطًا لتطبيق السمة LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
على النشاط.
<style name="ActivityTheme"> <item name="android:windowLayoutInDisplayCutoutMode"> shortEdges <!-- default, shortEdges, or never --> </item> </style>
توضّح الأقسام التالية أوضاع الصور المقطوعة المختلفة بمزيد من التفصيل.
السلوك التلقائي
إذا كان تطبيقك يستهدف SDK 35 ويعمل على جهاز Android 15، سيكون LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS
هو السلوك التلقائي،
ويتم تفسير LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT
على أنّه LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS
للنوافذ غير العائمة.
وبخلاف ذلك، يكون LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT
هو الخيار التلقائي.
عرض المحتوى في مناطق مقطوعة لحافة قصيرة
إذا كان تطبيقك يستهدف الإصدار 35 من حزمة تطوير البرامج (SDK) ويعمل على جهاز Android 15،
سيتم تفسير السمة LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
على أنّها LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS
للنوافذ غير العائمة.
من خلال LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
، يمتد المحتوى إلى منطقة الصورة المقطوعة على الحافة القصيرة للشاشة في الوضعَين العمودي والأفقي، بغض النظر عمّا إذا كانت أشرطة النظام مخفية أو مرئية. عند استخدام هذا الوضع، تأكد من عدم تداخل أي محتوى مهم
مع منطقة الصورة المقطوعة.
الصورة التالية هي مثال على LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
لجهاز في الوضع العمودي:
![صورة تعرض المحتوى في منطقة الصورة المقطوعة أثناء استخدام الوضع "بورتريه"](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-short-edges-1.png?authuser=6&hl=ar)
الصورة التالية هي مثال على السمة LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
لجهاز في الوضع الأفقي:
![صورة تعرض المحتوى في منطقة الصورة المقطوعة أثناء استخدام الوضع الأفقي](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-short-edges-2.png?authuser=6&hl=ar)
في هذا الوضع، تمتد النافذة أسفل القواطع على الحافة القصيرة للشاشة بالوضع العمودي والأفقي، بغض النظر عمَّا إذا كانت النافذة تخفي أشرطة النظام أم لا.
يعتبر القاطع في الزاوية على الحافة القصيرة:
![صورة تعرض جهازًا عليه رسم مائل بزاوية](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-corner.png?authuser=6&hl=ar)
عدم عرض المحتوى مطلقًا في منطقة الصورة المقطوعة للشاشة
إذا كان تطبيقك يستهدف الإصدار 35 من حزمة تطوير البرامج (SDK) ويعمل على جهاز Android 15،
سيتم تفسير السمة LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
على أنّها LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS
للنوافذ غير العائمة.
باستخدام LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
، لا يُسمَح أبدًا للنافذة
أن تتداخل مع منطقة الصورة المقطوعة.
إليك مثال على علامة LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
في الوضع العمودي:
![صورة تعرض LAYOUT_IN_DISPLAY_CUTOUT_mode_NEVER للصورة العمودية](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-never.png?authuser=6&hl=ar)
LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
لوضع "بورتريه".
في ما يلي مثال على LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
في
الوضع الأفقي:
![صورة تعرض LAYOUT_IN_DISPLAY_CUTOUT_mode_NEVER للوضع الأفقي](https://developer.android.com/static/develop/ui/views/layout/display-cutout/images/cutout-never-landscape.png?authuser=6&hl=ar)
LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
في الوضع الأفقي
أفضل الممارسات لإتاحة ظهور الصور المقطوعة للشاشة
عند التعامل مع القواطع للعرض، يجب مراعاة ما يلي:
- ضع في اعتبارك موضع العناصر المهمة في واجهة المستخدم. لا تدع منطقة الصورة المقطوعة تحجب أي نص أو عناصر تحكم أو معلومات أخرى مهمة.
- لا تضع أو توسِّع أي عناصر تفاعلية تتطلب التعرّف عليها بدقة في منطقة الصورة المقطوعة. قد تكون حساسية اللمس أقل في منطقة الصورة المقطوعة.
استخدِم
WindowInsetsCompat
، إن أمكن، لاسترداد ارتفاع شريط الحالة وتحديد المساحة المتروكة المناسبة لتطبيقها على المحتوى. تجنَّب الترميز الثابت لارتفاع شريط الحالة، لأنّ ذلك قد يؤدي إلى التداخل أو اقتطاع المحتوى.الشكل 7. استخدِم WindowInsetsCompat
لتجنّب تداخل المحتوى أو اقتطاعه.استخدِم
View.getLocationInWindow()
لتحديد مقدار مساحة النافذة التي يستخدمها تطبيقك. ولا تفترض أن التطبيق يستخدم النافذة بأكملها، ولا يستخدمView.getLocationOnScreen()
.استخدِم أوضاع الصور المقطوعة
always
أوshortEdges
أوnever
إذا كان تطبيقك بحاجة إلى الانتقال إلى الوضع المجسم أو الخروج منه. وقد يؤدي سلوك الاقتطاع التلقائي إلى عرض المحتوى في تطبيقك على منطقة الصورة المقطوعة إذا كانت أشرطة النظام متوفرة، ولكن ليس في الوضع المجسم. ينتج عن ذلك تحريك المحتوى لأعلى ولأسفل أثناء الانتقالات، كما هو موضح في المثال التالي.الشكل 8. مثال على محتوى يتحرّك للأعلى وللأسفل أثناء الانتقالات في الوضع المجسم، كن حذرًا عند استخدام إحداثيات النافذة مقابل الشاشة، لأن تطبيقك لا يستخدم الشاشة بأكملها عندما يكون مُعدًّا للعرض على شاشة عريضة أفقيًا. بسبب مربع الحروف، لا تكون الإحداثيات من أصل الشاشة مماثلة للإحداثيات من أصل النافذة. ويمكنك تحويل إحداثيات الشاشة إلى إحداثيات العرض حسب الحاجة باستخدام
getLocationOnScreen()
. توضح الصورة التالية كيف تختلف الإحداثيات عندما يكون المحتوى مُعدًّا للعرض على شاشة عريضة أفقيًا:الشكل 9. إحداثيات النافذة مقابل الشاشة عندما يكون المحتوى مُعدًّا للعرض على شاشة عريضة أفقيًا عند التعامل مع
MotionEvent
، استخدِمMotionEvent.getX()
وMotionEvent.getY()
لتجنُّب مشاكل الإحداثيات المتشابهة. لا تستخدِم السمةMotionEvent.getRawX()
أوMotionEvent.getRawY()
.
اختبار طريقة عرض المحتوى
اختبِر جميع شاشات تطبيقك وتجاربه. اختبر الأمر على الأجهزة التي تحتوي على أنواع مختلفة من القواطع، إن أمكن. إذا لم يكن لديك جهاز به صورة مقطوعة، يمكنك محاكاة إعدادات الاقتصاص الشائعة على أي جهاز أو محاكي يعمل بالإصدار Android 9 أو الإصدارات الأحدث من خلال تنفيذ ما يلي:
- فعِّل خيارات المطوّرين.
- في شاشة خيارات المطوّرين، انتقِل للأسفل إلى قسم الرسم واختَر محاكاة شاشة عرض بها صورة مقطوعة.
اختَر نوع الصورة المقطوعة.
الشكل 10. خيارات المطوّرين لاختبار كيفية عرض المحتوى.
مصادر إضافية
- LAYOUT_IN_DISPLAY_CUTOUT_أوضاع_ALWAYS
- LAYOUT_IN_DISPLAY_CUTOUT_أوضاع_NEVER
- LAYOUT_IN_DISPLAY_CUTOUT_mode_SHORT_EDGES
- LAYOUT_IN_DISPLAY_CUTOUT_mode_DEFAULT