تُعدّ التنسيقات الأساسية مثبَتة ومتعددة الاستخدامات توفّر تجربة مثالية للمستخدم على مجموعة متنوعة من أشكال الأجهزة.
تتوافق التنسيقات الأساسية مع الهواتف ذات الشاشات الصغيرة بالإضافة إلى الأجهزة اللوحية والأجهزة القابلة للطي وأجهزة ChromeOS. تستند التنسيقات إلى إرشادات التصميم المتعدد الأبعاد، وهي ملفتة للنظر وعملية في الوقت نفسه.
يتضمّن إطار عمل Android مكونات مخصّصة تسهّل تنفيذ التنسيقات بشكل مباشر وموثوق.
تُنشئ التنسيقات الأساسية واجهات مستخدم جذابة تعزّز الإنتاجية، وهي تشكل أساس التطبيقات الرائعة.
عرض على شكل قائمة مع تفاصيل
يتيح تخطيط تفاصيل القائمة للمستخدمين استكشاف قوائم العناصر التي تحتوي على معلومات وصفية أو توضيحية أو معلومات تكميلية أخرى - تفاصيل العنصر.
يقسم التخطيط نافذة التطبيق إلى جزأين متجاورين: أحدهما للقائمة، والآخر للتفاصيل. يختار المستخدمون سلعًا من القائمة لعرض تفاصيلها. تؤدي الروابط المؤدية إلى صفحات معيّنة في التفاصيل إلى عرض محتوى إضافي في لوحة التفاصيل.
تلائم الشاشات ذات العرض الموسّع (راجِع استخدام فئات حجم النوافذ) كلّ من القائمة والتفاصيل في الوقت نفسه. يؤدي اختيار عنصر من القائمة إلى تعديل panedetail لعرض المحتوى ذي الصلة بالعنصر المحدّد.
تعرض شاشات العرض ذات العرض المتوسط والمدمَج إما القائمة أو التفاصيل، وذلك استنادًا إلى تفاعل المستخدم مع التطبيق. عندما تكون القائمة فقط مرئية، يؤدي اختيار أحد عناصر القائمة إلى عرض التفاصيل بدلاً من القائمة. عندما تكون التفاصيل فقط مرئية، يؤدي الضغط على زر الرجوع إلى إعادة عرض القائمة.
يمكن أن تؤدي تغييرات الإعدادات، مثل تغييرات اتجاه الجهاز أو تغييرات حجم نافذة التطبيق، إلى تغيير فئة حجم نافذة العرض. يستجيب تنسيق قائمة التفاصيل وفقًا لذلك، مع الحفاظ على حالة التطبيق:
- إذا تم تصغير شاشة العرض ذات العرض الموسّع التي تعرض كلّ من لوحتَي القائمة والتفاصيل ليصبح حجمها متوسطًا أو صغيرًا، تظل لوحة التفاصيل ظاهرة ويتم إخفاء لوحة القائمة.
- إذا كان العرض المتوسط أو المكثّف يعرض جزء التفاصيل فقط وتم توسيع فئة حجم النافذة لتوسيعها، يتم عرض القائمة والتفاصيل معًا، وتشير القائمة إلى أنّه تم تحديد العنصر المقابل للمحتوى في جزء التفاصيل
- إذا كانت شاشة العرض متوسطة أو مدمجة العرض لا تعرض سوى لوحة القائمة ويتم توسيعها إلى وضع موسّع، يتم عرض القائمة ولوحة تفاصيل العنصر النائب معًا.
يُعدّ عرض التفاصيل في شكل قائمة مثاليًا لتطبيقات المراسلة أو مدراء جهات الاتصال أو برامج تصفّح الملفات أو أي تطبيق يمكن فيه تنظيم المحتوى كقائمة من العناصر التي تكشف عن معلومات إضافية.
التنفيذ
تتيح النماذج الوصفية لميزة "الإنشاء" منطق فئة حجم النافذة الذي يحدّد ما إذا كان سيتم عرض لوحتَي القائمة والتفاصيل في الوقت نفسه (عند توسيع فئة حجم النافذة بالعرض) أو لوحة القائمة أو التفاصيل فقط (عندما تكون فئة حجم النافذة بالعرض متوسطة أو مدمجة).
لضمان تدفق البيانات أحادي الاتجاه، عليك رفع جميع الحالات، بما في ذلك فئة حجم النافذة الحالية وتفصيل عنصر القائمة المحدّد (إن توفّر)، حتى تتمكّن جميع العناصر القابلة للتجميع من الوصول إلى البيانات ويمكن عرضها بشكل صحيح.
عند عرض لوحة التفاصيل فقط على أحجام النوافذ الصغيرة، أضِف BackHandler
لإزالة لوحة التفاصيل وعرض لوحة القائمة فقط. BackHandler ليس
جزءًا من التنقّل العام في التطبيق لأنّ معالِج الحدث يعتمد على
فئة حجم النافذة وحالة التفاصيل المحدّدة.
للحصول على مثال على التنفيذ، اطّلِع على مثال قائمة التفاصيل باستخدام Compose.
الخلاصة
يرتب تنسيق الخلاصة عناصر المحتوى المكافئة في شبكة قابلة للتهيئة للحصول على عرض سريع ومناسب لكمية كبيرة من المحتوى.
يحدّد الحجم والموضع العلاقات بين عناصر المحتوى.
يتم إنشاء مجموعات المحتوى من خلال جعل العناصر متماثلة الحجم ووضعها معًا. يتمّ جذب الانتباه إلى العناصر من خلال جعلها أكبر من العناصر المجاورة.
إنّ البطاقات والقوائم هي مكوّنات شائعة لتنسيقات الخلاصات.
يتيح تنسيق الخلاصة العروض بأي حجم تقريبًا لأن الشبكة يمكن أن تتكيف من عمود تمرير واحد إلى خلاصة تمرير متعددة الأعمدة للمحتوى.
تُعدّ الخلاصات مناسبة بشكل خاص لتطبيقات الأخبار ووسائل التواصل الاجتماعي.
التنفيذ
Feed 包含大量内容元素，这些内容元素位于一个纵向滚动容器中，而该容器采用网格布局。延迟列表可高效地在列或行中呈现大量的项。延迟网格以网格形式呈现项，支持配置项的大小和 span。
根据可用的显示区域配置网格布局的列，以设置网格项允许的最小宽度。定义网格项时，只需调整列 span 即可让某些项比其他项更为醒目。
对于部分标题、分隔线或要占据 Feed 的整个宽度的其他项，请使用 maxLineSpan 占据布局的整个宽度。
如果较小宽度的显示屏没有足够的空间来显示一个以上的列，LazyVerticalGrid 就会像 LazyColumn 一样运行。
如需查看示例实现，请参阅使用 Compose 构建 Feed 示例。
اللوحة الداعمة
يُنظِّم تنسيق اللوحة المتوافق مع الشاشة محتوى التطبيق في مساحتَي الشاشة الأساسية والثانوية.
تشغل منطقة العرض الأساسية معظم مساحة نافذة التطبيق (عادةً ثلثيها تقريبًا) وتحتوي على المحتوى الرئيسي. منطقة العرض الثانوية عبارة عن جزء يشغل ما تبقى من نافذة التطبيق ويقدم المحتوى الذي يدعم المحتوى الرئيسي.
تعمل تنسيقات اللوحة المتوافقة بشكل جيد مع شاشات العرض الموسّعة (راجِع استخدام فئات حجم النافذة) في الاتجاه الأفقي. شاشات العرض ذات العرض المتوسط أو المكثّف تتيح إظهار منطقتي العرض الأساسية والثانوية إذا كان المحتوى قابلاً للتكيف مع مساحات العرض الأضيق، أو إذا كان من الممكن إخفاء المحتوى الإضافي مبدئيًا في ورقة سفلية أو جانبية يمكن الوصول إليها عن طريق عناصر تحكم مثل قائمة أو زر.
يختلف تنسيق اللوحة الداعمة عن تنسيق التفاصيل في القائمة من حيث علاقة المحتوى الأساسي بالمحتوى الثانوي. لا يكون محتوى اللوحة الثانوية مفعّلاً إلا في ما يتعلّق بالمحتوى الأساسي. على سبيل المثال، لا تكون نافذة أداة اللوحة الداعمة ذات صلة بحد ذاتها. ومع ذلك، فإنّ المحتوى الإضافي في لوحة التفاصيل من تنسيق التفاصيل في القائمة يكون ذا معنى حتى بدون المحتوى الأساسي، على سبيل المثال، وصف منتج من بطاقة بيانات المنتج.
تشمل حالات استخدام اللوحة الداعمة ما يلي:
- تطبيقات الإنتاجية: وثيقة أو جدول بيانات مصحوبة بتعليقات المراجع في جزء داعم
- تطبيقات الوسائط: فيديو يتم بثه مع قائمة بالفيديوهات ذات الصلة في لوحة داعمة، أو عرض ألبوم موسيقي مع ميزة إضافة قائمة تشغيل
- تطبيقات البحث والرجوع: نموذج إدخال طلب بحث مع النتائج في pane داعمة
التنفيذ
Compose 支持窗口大小类别逻辑，借助该逻辑，您可以确定是同时显示主要内容和辅助内容，还是将辅助内容放置在其他位置。
提升所有状态，包括当前窗口大小类别以及与主要内容和辅助内容中的数据相关的信息。
对于较小宽度的显示屏，请将辅助内容放置在主要内容下方或底部动作条中。对于中等宽度和较大宽度的显示屏，可将辅助内容放置在主要内容旁边，并根据内容和可用空间适当调整辅助内容的大小。对于中等宽度，请在主要内容和辅助内容之间平均分配显示空间。对于较大宽度的显示屏，可为主要内容分配 70% 的空间，并为辅助内容分配 30% 的空间。
如需查看示例实现，请参阅使用 Compose 构建辅助窗格示例。
مصادر إضافية
- تصميم متعدد الأبعاد: التنسيقات الأساسية