بدء استخدام التطبيقات التكيّفية

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

ما هي التطبيقات التكيّفية؟

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

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

الشكل 1. يحسِّن التطبيق التكيُّفي التنسيق لأحجام النوافذ المختلفة.

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

تظهر التطبيقات المتكيّفة بشكل رائع وتعمل بشكل جيد على أي جهاز بأي إعداد.

لماذا يجب إنشاء واجهات مستخدم متكيّفة؟

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

تفوّت التطبيقات التي تقتصر على تنفيذ مهمة واحدة على الهواتف العادية فرصة الاستفادة من قاعدة مستخدمين متزايدة تتضمّن إمكانات متنوعة.

Google Play

يوفّر Google Play مجموعات من التطبيقات واقتراحات خاصة بالأجهزة اللوحية والهواتف القابلة للطي، ما يتيح للمستخدمين استكشاف تطبيقات عالية الجودة.

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

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

بطاقة بيانات المتجر على Google Play لتطبيق يتضمّن تحذيرًا ينص على أنّه "قد لا يكون التطبيق محسّنًا لجهازك".
الشكل 2. تحذير بشأن الجودة الفنية في صفحة تفاصيل التطبيق

يمكنك إنشاء تطبيقات متكيّفة لتوسيع نطاق إمكانية العثور عليها على Google Play وزيادة عدد الأجهزة التي يمكنها تنزيل تطبيقك إلى أقصى حد.

كيفية البدء

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

لإنشاء تطبيق متكيّف يتوافق مع جميع أحجام الشاشات وإعداداتها، اتّبِع الخطوات التالية:

  • استخدام فئات حجم النافذة لاتخاذ قرارات بشأن التصميم
  • إنشاء تطبيقات باستخدام مكتبة Compose Material 3 Adaptive
  • إتاحة طرق إدخال أخرى غير اللمس
  • الاختبار على جميع أنواع الأجهزة

فئات حجم النافذة

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

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

تُصنِّف فئات حجم النافذة نوافذ التطبيقات على أنّها مضغوطة أو متوسطة أو موسّعة استنادًا إلى عرض النافذة أو ارتفاعها.

تصوير لفئات أحجام النوافذ المضغوطة والمتوسطة والكبيرة
الشكل 3. فئات حجم النافذة استنادًا إلى عرض الشاشة

احتسِب WindowSizeClass لتطبيقك باستخدام الدالة ذات المستوى الأعلى currentWindowAdaptiveInfo() في مكتبة Compose Material 3 Adaptive. تعرض الدالة مثيلاً من WindowAdaptiveInfo، يحتوي على windowSizeClass. يتلقّى تطبيقك تحديثات كلما تغيّر حجم النافذة:

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass

لوحات المحتوى

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

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

تتيح لك فئات أحجام النوافذ تحديد عدد لوحات المحتوى التي سيتم عرضها في التصاميم المتعددة اللوحات، كما هو موضّح في التصميم المتعدد الأبعاد.

تنقسم شاشات الأجهزة إلى لوحات: لوحة واحدة في فئتَي أحجام النوافذ المضغوطة والمتوسطة، ولوحتان في فئة حجم النافذة الموسّعة.
الشكل 4. عدد لوحات المحتوى لكل فئة من فئات حجم النافذة

يمكن التنقّل بين اللوحات. في فئتَي أحجام النوافذ المدمجة والمتوسطة، تعرض التطبيقات لوحة واحدة، وبالتالي، يعرض التنقّل إلى أي وجهة لوحة واحدة.

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

الشكل 5. عرض على شكل قائمة مع تفاصيل مع لوحة القائمة كهدف للتنقّل
الشكل 6. عرض على شكل قائمة مع تفاصيل يتضمّن جزء التفاصيل كهدف للتنقّل

Compose Material 3 Adaptive

‫Jetpack Compose هو نهج حديث تصريحي لإنشاء تطبيقات تكيُّفية بدون تكرار وبدون عبء الصيانة الناتج عن ملفات التنسيق المتعددة.

تحتوي مكتبة Compose Material 3 Adaptive على عناصر قابلة للإنشاء تدير فئات أحجام النوافذ ومكوّنات التنقّل والتنسيقات المتعددة اللوحات وأوضاع الأجهزة القابلة للطي وموقع المفصلة، على سبيل المثال:

مكتبة Compose Material 3 Adaptive هي إحدى الاعتماديات الرئيسية لتطوير تطبيقات متكيّفة.

الإعداد والاستمرارية

تحافظ التطبيقات المتكيّفة على استمرارية عملها أثناء تغييرات الإعدادات.

يحدث تغيير في الإعدادات عند تغيير حجم نافذة التطبيق أو وضع الجهاز القابل للطي أو كثافة الشاشة أو الخط.

تؤدي تغييرات الإعدادات تلقائيًا إلى إعادة إنشاء نشاط التطبيق، ويتم فقدان جميع حالات النشاط. للحفاظ على استمرارية التطبيقات التكيّفية، يتم حفظ الحالة في طريقة onSaveInstanceState() الخاصة بالنشاط أو في ViewModel.

وضعية الجسم

تتجاوب التطبيقات المتكيّفة مع التغييرات في وضع الأجهزة القابلة للطي. تشمل أوضاع الجهاز وضعية الجهاز على الطاولة ووضعية الكتاب.

هاتف قابل للطي في وضع "التثبيت على سطح مستوٍ"، حيث يستند النصف السفلي من الشاشة إلى سطح ويكون النصف العلوي منتصبًا
الشكل 7. جهاز قابل للطي في وضع "التثبيت على سطح مستوٍ"

تتيح لك واجهة WindowInfoTracker في Jetpack WindowManager الحصول على قائمة بعناصر DisplayFeature للجهاز. من بين ميزات الشاشة FoldingFeature.State، التي تشير إلى ما إذا كان الجهاز مفتوحًا بالكامل أو نصف مفتوح.

توفّر مكتبة Compose Material 3 Adaptive الدالة ذات المستوى الأعلى currentWindowAdaptiveInfo()، والتي تعرض مثيلاً من WindowAdaptiveInfo يحتوي على windowPosture.

طرق إدخال أخرى غير اللمس

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

تتوافق التطبيقات المتكيّفة مع أجهزة الإدخال الخارجية، ولكن إطار عمل Android يتولّى معظم العمل نيابةً عنك:

  • ‫Jetpack Compose 1.7 والإصدارات الأحدث: تتوفّر ميزة التنقّل باستخدام مفتاح Tab على لوحة المفاتيح والنقر والاختيار والتمرير باستخدام الماوس أو لوحة التتبّع تلقائيًا.

  • مكتبة Jetpack androidx.compose.material3: تتيح للمستخدمين الكتابة في أي مكوّن TextField باستخدام قلم إلكتروني.

  • مساعد اختصارات لوحة المفاتيح: يتيح للمستخدمين العثور على اختصارات لوحة المفاتيح الخاصة بنظام Android الأساسي والتطبيقات. انشر اختصارات لوحة المفاتيح الخاصة بتطبيقك في "مساعد اختصارات لوحة المفاتيح" من خلال إلغاء وظيفة معاودة الاتصال onProvideKeyboardShortcuts() الخاصة بالنافذة.

ولإتاحة استخدام التطبيقات المتجاوبة على جميع أشكال الأجهزة بجميع أحجامها، يجب أن تتوافق مع جميع أنواع الإدخال.

كيفية اختبار التطبيقات المتكيّفة

اختبِر أحجام الشاشات والنوافذ المختلفة وإعدادات الأجهزة المختلفة. استخدِم لقطات الشاشة على الجهاز المضيف ومعاينات Compose للتحقّق من تخطيطات تطبيقك. تشغيل تطبيقك على محاكيات استوديو Android وأجهزة Android البعيدة المستضافة في مراكز بيانات Google

إرشادات جودة التطبيقات على الشاشات الكبيرة

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

إعدادات متعدّدة

تتيح لك واجهة DeviceConfigurationOverride في Compose 1.7 والإصدارات الأحدث تجاوز جوانب مختلفة من إعدادات الجهاز. تحاكي واجهة برمجة التطبيقات إعدادات مختلفة للأجهزة بطريقة متوافقة مع اللغة المحلية لأي محتوى قابل للإنشاء تريد اختباره. على سبيل المثال، يمكنك اختبار أحجام متعددة وعشوائية لواجهة المستخدم في عملية تشغيل واحدة لمجموعة الاختبارات على جهاز واحد أو محاكي واحد.

باستخدام دالة الإضافة DeviceConfigurationOverride.then()، يمكنك اختبار معلَمات إعدادات متعددة، مثل حجم الخط واللغة والمظهر وحجم التنسيق، وكل ذلك في الوقت نفسه.

لقطات الشاشة من الجهاز المضيف

تُعدّ اختبارات لقطات الشاشة من جهة المضيف طريقة سريعة وقابلة للتوسّع للتحقّق من المظهر المرئي لتنسيقات تطبيقك. استخدِم لقطات الشاشة من جهة المضيف لاختبار واجهة المستخدم على مجموعة متنوعة من أحجام الشاشات.

لمزيد من المعلومات، يُرجى الاطّلاع على اختبار لقطات الشاشة الخاصة بميزة "إنشاء معاينة Compose".

معاينات Compose

تتيح لك معاينات Compose التحقّق من واجهة المستخدم لتطبيقك في عرض التصميم في "استوديو Android". تستخدِم المعاينات تعليقات توضيحية، مثل @PreviewScreenSizes و@PreviewFontScale و@PreviewLightDark، لتتيح لك الاطّلاع على المحتوى القابل للإنشاء في إعدادات مختلفة. يمكنك حتى التفاعل مع المعاينات.

يُبرز "استوديو Android" أيضًا مشاكل الاستخدام الشائعة في المعاينات، مثل الأزرار أو الحقول النصية الواسعة جدًا.

لمزيد من المعلومات، يُرجى الاطّلاع على معاينة واجهة المستخدم باستخدام المعاينات القابلة للإنشاء.

المحاكيات

يوفّر "استوديو Android" مجموعة متنوعة من المحاكيات لاختبار أحجام التصميم المختلفة:

  • محاكي قابل لتغيير الحجم: يحاكي هاتفًا أو جهازًا لوحيًا أو جهازًا قابلاً للطي، ويتيح لك التبديل بينها بسرعة
  • محاكي Pixel Fold: يحاكي هاتف Pixel Fold القابل للطي بشاشة كبيرة
  • محاكي Pixel Tablet: يحاكي جهاز Pixel Tablet ذو الشاشة الكبيرة
  • محاكي الكمبيوتر المكتبي: يتيح لك اختبار عرض النوافذ الحرة والتمرير بالماوس فوق العناصر واختصارات لوحة المفاتيح

بث المحتوى على جهاز بعيد

يمكنك الربط بأمان بأجهزة Android بعيدة تتم استضافتها في مراكز بيانات Google وتشغيل تطبيقك على أحدث أجهزة Pixel وSamsung. يمكنك تثبيت التطبيقات وتصحيح أخطائها وتشغيل أوامر ADB وتدوير الأجهزة وطيّها للتأكّد من أنّ تطبيقك يعمل بشكل جيد على مجموعة متنوعة من الأجهزة الحقيقية.

تم دمج ميزة البث على جهاز بعيد في "استوديو Android". لمزيد من المعلومات، يُرجى الاطّلاع على بث أجهزة Android من خلال Firebase.

مراجع إضافية