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

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

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

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

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

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

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

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

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

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

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

Google Play

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

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

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

الشكل 2. تحذير بشأن الجودة الفنية في صفحة تفاصيل التطبيق

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

كيفية البدء

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

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

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

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

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

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

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

الشكل 3. فئات حجم النافذة استنادًا إلى عرض الشاشة

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

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

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

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

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

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

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

الشكل 4. عدد لوحات المحتوى لكل فئة من فئات حجم النافذة

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

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

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

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

Compose Material 3 Adaptive

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

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

• NavigationSuiteScaffold: يتم التبديل تلقائيًا بين شريط التنقّل وقضيب التنقّل استنادًا إلى فئة حجم نافذة التطبيق ووضعية الجهاز.

• ListDetailPaneScaffold: تنفّذ عرض على شكل قائمة مع تفاصيل.

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

• ‫SupportingPaneScaffold: تنفّذ تنسيقًا أساسيًا للوحة المحتوى الجانبي.

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

تُعدّ مكتبة 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 والإصدارات الأحدث: تتوافق هذه الإصدارات تلقائيًا مع التنقّل باستخدام علامة التبويب في لوحة المفاتيح والنقر والاختيار والتمرير باستخدام الماوس أو لوحة التتبّع.

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

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

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

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

اختبِر أحجام الشاشات والنوافذ المختلفة وإعدادات الأجهزة المختلفة. استخدِم لقطات الشاشة على الجهاز المضيف ومعاينات Compose للتحقّق من تخطيطات تطبيقك. تشغيل تطبيقك على محاكيات Android Studio وأجهزة 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.

مراجع إضافية

• عرض تقديمي في مؤتمر I/O: إنشاء تطبيقات Android متكيّفة