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

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

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

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

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

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

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

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

حساب قيمة WindowSizeClass الحالية باستخدام دالة دالة المستوى الأعلى currentWindowAdaptiveInfo() androidx.compose.material3.adaptive مكتبة. تُرجع الدالة دالة مثيل WindowAdaptiveInfo، الذي يحتوي على windowSizeClass. تشير رسالة الأشكال البيانية يوضح المثال التالي كيفية حساب فئة حجم النافذة واستلام يتم إجراء التعديلات عند تغيير فئة حجم النافذة:

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

Manage layouts with window size classes

Window size classes enable you to change your app layout as the display space available to your app changes, for example, when a device folds or unfolds, the device orientation changes, or the app window is resized in multi‑window mode.

Localize the logic for handling display size changes by passing window size classes down as state to nested composables just like any other app state:

@Composable
fun MyApp(
    windowSizeClass: WindowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
) {
    // Perform logic on the size class to decide whether to show the top app bar.
    val showTopAppBar = windowSizeClass.windowHeightSizeClass != WindowHeightSizeClass.COMPACT

    // MyScreen knows nothing about window sizes, and performs logic based on a Boolean flag.
    MyScreen(
        showTopAppBar = showTopAppBar,
        /* ... */
    )
}
AdaptiveLayoutSnippets.kt

اختبار فئات حجم النافذة

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

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

الخطوات التالية

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

• بالنسبة إلى التنسيقات المستندة إلى الإنشاء: يمكن استخدام أحجام الشاشة المختلفة

• بالنسبة إلى التنسيقات المستنِدة إلى طريقة العرض: تصميم سريع الاستجابة أو التكيفي مع عدد مرات المشاهدة

للتعرّف على مزيد من المعلومات حول العوامل التي تجعل التطبيق رائعًا على جميع الأجهزة وأحجام الشاشات، راجِع:

• نقل بيانات واجهة المستخدم إلى التنسيقات المتجاوبة
• جودة التطبيقات ذات الشاشة الكبيرة