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

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

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

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

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

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

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

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

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

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

Google Play

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

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

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

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

كيفية البدء

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

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

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

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

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

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

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

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

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

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

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

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

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

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

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

Compose Material 3 Adaptive

‫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 والتطبيقات. يمكنك نشر اختصارات لوحة المفاتيح لتطبيقك في مساعد اختصارات لوحة المفاتيح من خلال إلغاء callback window onProvideKeyboardShortcuts().

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

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

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

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

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

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

تتيح لك واجهة 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 Device Streaming المستند إلى Firebase.

مصادر إضافية

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