إنشاء تطبيقات قابلة للتكيّف

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

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

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

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

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

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

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

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

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

Google Play

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

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

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

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

كيفية البدء

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

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

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

فئات أحجام النوافذ

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

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

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

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

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

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

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

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

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

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

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

إنشاء أسلوب Material 3 التكيّفي

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

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

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

• ListDetailPaneScaffold: تنفيذ تنسيق أساسي لتفاصيل القائمة

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

• ‫SupportingPaneScaffold: تُنفِّذ تنسيق اللوحة الداعمة الأساسية.

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

مكتبة Compose Material 3 Adaptive هي مكتبة أساسية لإنشاء التطبيقات التكيُّفية.

الضبط والاستمرارية

تحتفظ التطبيقات التكيُّفية بالاستمرارية أثناء تغييرات الضبط.

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

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

الوضعية

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

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

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

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

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

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

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

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

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

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

كيفية اختبار التطبيقات المتوافقة مع الأجهزة المتعددة

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

إرشادات جودة التطبيقات المخصّصة للشاشات الكبيرة

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

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

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

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

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

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

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

إنشاء معاينات

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

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

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

برامج المحاكاة

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

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

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

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

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

مراجع إضافية

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