این صفحه به‌وسیله ‏Cloud Translation API‏ ترجمه شده است.

از کلاس های اندازه پنجره استفاده کنید

کلاس‌های اندازه پنجره مجموعه‌ای از نقاط شکست دیدگاه هستند که به شما در طراحی، توسعه و آزمایش طرح‌بندی‌های پاسخگو/تطبیقی کمک می‌کنند. نقاط شکست سادگی طرح‌بندی را با انعطاف‌پذیری بهینه‌سازی برنامه شما برای موارد منحصر به فرد متعادل می‌کند.

کلاس‌های اندازه پنجره، ناحیه نمایش در دسترس برنامه شما را به‌عنوان فشرده ، متوسط یا گسترده دسته‌بندی می‌کنند. عرض و ارتفاع موجود به طور جداگانه طبقه‌بندی می‌شوند، بنابراین در هر نقطه از زمان، برنامه شما دارای دو کلاس اندازه پنجره است-یکی برای عرض، یکی برای ارتفاع. عرض در دسترس معمولاً به دلیل فراگیر بودن پیمایش عمودی مهمتر از ارتفاع موجود است، بنابراین کلاس اندازه پنجره عرض احتمالاً بیشتر به رابط کاربری برنامه شما مرتبط است.

**شکل 1.** نمایش کلاس های اندازه پنجره مبتنی بر عرض.

**شکل 2.** نمایش کلاس های اندازه پنجره مبتنی بر ارتفاع.

همانطور که در شکل‌ها مشاهده می‌شود، نقاط شکست به شما اجازه می‌دهند تا در مورد چیدمان‌ها از نظر دستگاه‌ها و پیکربندی‌ها فکر کنید. هر نقطه شکست کلاس اندازه یک مورد اکثریت را برای سناریوهای دستگاه معمولی نشان می دهد، که می تواند یک چارچوب مرجع مفید باشد، همانطور که شما در مورد طراحی طرح بندی های مبتنی بر نقطه شکست خود فکر می کنید.

کلاس اندازه	نقطه شکست	نمایندگی دستگاه
عرض جمع و جور	عرض < 600dp	99.96 درصد از تلفن ها در حالت پرتره
عرض متوسط	600dp ≤ عرض < 840dp	93.73 درصد از تبلت ها به صورت پرتره، بیشتر نمایشگرهای داخلی تا شده بزرگ به صورت پرتره
عرض گسترش یافته است	عرض ≥ 840dp	97.22٪ از تبلت ها در چشم انداز، بیشتر نمایشگرهای داخلی باز شده بزرگ در چشم انداز
ارتفاع جمع و جور	ارتفاع < 480dp	99.78٪ از تلفن ها در چشم انداز
ارتفاع متوسط	480dp ≤ ارتفاع < 900dp	96.56٪ از تبلت ها در چشم انداز، 97.59 درصد از تلفن ها در حالت پرتره
ارتفاع منبسط شده	ارتفاع ≥ 900dp	94.25 درصد تبلت ها به صورت پرتره

اگرچه تجسم کلاس‌های اندازه به عنوان دستگاه‌های فیزیکی می‌تواند مفید باشد، کلاس‌های اندازه پنجره به صراحت با اندازه صفحه دستگاه تعیین نمی‌شوند. کلاس های اندازه پنجره برای منطق نوع isTablet در نظر گرفته نشده اند. در عوض، کلاس‌های اندازه پنجره با اندازه پنجره در دسترس برنامه شما بدون توجه به نوع دستگاهی که برنامه روی آن اجرا می‌شود تعیین می‌شود، که دو مفهوم مهم دارد:

دستگاه های فیزیکی کلاس اندازه پنجره خاصی را تضمین نمی کنند. فضای صفحه در دسترس برنامه شما به دلایل زیادی می تواند با اندازه صفحه نمایش دستگاه متفاوت باشد. در دستگاه های تلفن همراه، حالت تقسیم صفحه می تواند صفحه را بین دو برنامه تقسیم کند. در ChromeOS، برنامه‌های Android را می‌توان در پنجره‌هایی از نوع دسک‌تاپ ارائه کرد که به‌طور دلخواه قابل تغییر اندازه هستند. تاشوها می‌توانند دو صفحه نمایش با اندازه‌های مختلف داشته باشند که با تا کردن یا باز کردن دستگاه به‌صورت جداگانه قابل دسترسی هستند.
کلاس اندازه پنجره می تواند در طول عمر برنامه شما تغییر کند. در حالی که برنامه شما در حال اجرا است، تغییر جهت دستگاه، انجام چند کار، و تا کردن/باز کردن می‌تواند میزان فضای موجود روی صفحه را تغییر دهد. در نتیجه، کلاس اندازه پنجره پویا است و رابط کاربری برنامه شما باید مطابق با آن سازگار شود.

کلاس‌های اندازه پنجره به نقاط شکست فشرده، متوسط و گسترده در راهنمای طرح‌بندی مواد طراحی می‌شوند. از کلاس‌های اندازه پنجره برای تصمیم‌گیری در مورد طرح‌بندی برنامه در سطح بالا استفاده کنید، مانند تصمیم‌گیری در مورد استفاده از یک طرح‌بندی متعارف خاص برای استفاده از فضای اضافی صفحه.

WindowSizeClass فعلی را با استفاده از تابع سطح بالای currentWindowAdaptiveInfo() کتابخانه androidx.compose.material3.adaptive محاسبه کنید. تابع نمونه ای از WindowAdaptiveInfo را برمی گرداند که حاوی windowSizeClass است. مثال زیر نحوه محاسبه کلاس اندازه پنجره و دریافت به روز رسانی هر زمان که کلاس اندازه پنجره تغییر می کند نشان می دهد:

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClassAdaptiveLayoutSnippets.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

کلاس های اندازه پنجره را آزمایش کنید

همانطور که در طرح‌بندی تغییراتی ایجاد می‌کنید، رفتار طرح‌بندی را در تمام اندازه‌های پنجره، به‌ویژه در پهنای نقطه شکست فشرده، متوسط و گسترش یافته آزمایش کنید.

اگر طرح‌بندی موجود برای صفحه‌نمایش‌های جمع‌وجور دارید، ابتدا طرح‌بندی خود را برای کلاس اندازه پهن‌شده بهینه کنید، زیرا این کلاس اندازه بیشترین فضا را برای محتوای اضافی و تغییرات UI فراهم می‌کند. سپس تصمیم بگیرید که چه چیدمانی برای کلاس اندازه عرض متوسط منطقی است. اضافه کردن یک طرح بندی تخصصی را در نظر بگیرید.

مراحل بعدی

برای کسب اطلاعات بیشتر در مورد نحوه استفاده از کلاس‌های اندازه پنجره برای ایجاد طرح‌بندی‌های واکنش‌گرا/تطبیقی، به موارد زیر مراجعه کنید:

برای طرح‌بندی‌های مبتنی بر نوشتن: از اندازه‌های مختلف صفحه پشتیبانی کنید
برای طرح‌بندی‌های مبتنی بر نما: طراحی واکنش‌گرا/تطبیقی با نماها

برای کسب اطلاعات بیشتر در مورد آنچه که یک برنامه را در همه دستگاه‌ها و اندازه‌های صفحه نمایش عالی می‌کند، ببینید:

کلاس اندازه	نقطه شکست	نمایندگی دستگاه
عرض جمع و جور	عرض < 600dp	99.96 درصد از تلفن ها در حالت پرتره
عرض متوسط	600dp ≤ عرض < 840dp	93.73 درصد از تبلت ها به صورت پرتره، بیشتر نمایشگرهای داخلی تا شده بزرگ به صورت پرتره
عرض گسترش یافته است	عرض ≥ 840dp	97.22٪ از تبلت ها در چشم انداز، بیشتر نمایشگرهای داخلی باز شده بزرگ در چشم انداز
ارتفاع جمع و جور	ارتفاع < 480dp	99.78٪ از تلفن ها در چشم انداز
ارتفاع متوسط	480dp ≤ ارتفاع < 900dp	96.56٪ از تبلت ها در چشم انداز، 97.59 درصد از تلفن ها در حالت پرتره
ارتفاع منبسط شده	ارتفاع ≥ 900dp	94.25 درصد تبلت ها به صورت پرتره

دستگاه های فیزیکی کلاس اندازه پنجره خاصی را تضمین نمی کنند. فضای صفحه در دسترس برنامه شما به دلایل زیادی می تواند با اندازه صفحه نمایش دستگاه متفاوت باشد. در دستگاه های تلفن همراه، حالت تقسیم صفحه می تواند صفحه را بین دو برنامه تقسیم کند. در ChromeOS، برنامه‌های Android را می‌توان در پنجره‌هایی از نوع دسک‌تاپ ارائه کرد که به‌طور دلخواه قابل تغییر اندازه هستند. تاشوها می‌توانند دو صفحه نمایش با اندازه‌های مختلف داشته باشند که با تا کردن یا باز کردن دستگاه به‌صورت جداگانه قابل دسترسی هستند.
کلاس اندازه پنجره می تواند در طول عمر برنامه شما تغییر کند. در حالی که برنامه شما در حال اجرا است، تغییر جهت دستگاه، انجام چند کار، و تا کردن/باز کردن می‌تواند میزان فضای موجود روی صفحه را تغییر دهد. در نتیجه، کلاس اندازه پنجره پویا است و رابط کاربری برنامه شما باید مطابق با آن سازگار شود.

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClassAdaptiveLayoutSnippets.kt

Manage layouts with window size classes

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

کلاس های اندازه پنجره را آزمایش کنید

مراحل بعدی

برای طرح‌بندی‌های مبتنی بر نوشتن: از اندازه‌های مختلف صفحه پشتیبانی کنید
برای طرح‌بندی‌های مبتنی بر نما: طراحی واکنش‌گرا/تطبیقی با نماها

قبلی

پشتیبانی از اندازه های مختلف صفحه نمایش

بعدی

پشتیبانی از حالت چند پنجره ای