Классы размеров окон

Классы размеров окон — это набор точек останова области просмотра, которые помогают проектировать, разрабатывать и тестировать адаптивные макеты. Точки останова сочетают простоту макета с гибкостью оптимизации вашего приложения для уникальных случаев.

Классы размеров окон классифицируют область отображения, доступную вашему приложению, на компактную , среднюю или расширенную . Доступная ширина и высота классифицируются отдельно, поэтому в любой момент времени ваше приложение имеет два класса размеров окон — один для ширины, другой для высоты. Доступная ширина обычно более важна, чем доступная высота из-за повсеместного распространения вертикальной прокрутки, поэтому класс размера окна ширины, вероятно, более актуален для пользовательского интерфейса вашего приложения.

Как показано на рисунках, точки останова позволяют вам продолжать думать о макетах с точки зрения устройств и конфигураций. Каждая точка останова класса размера представляет собой большинство случаев для типичных сценариев устройства, что может быть полезным ориентиром при проектировании макетов на основе точек останова.

Хотя визуализация классов размеров как физических устройств может быть полезной, классы размеров окон явно не определяются размером экрана устройства. Классы размеров окон не предназначены для логики типа isTablet . Скорее, классы размеров окон определяются размером окна, доступным вашему приложению, независимо от типа устройства, на котором приложение работает, что имеет два важных последствия:

• Физические устройства не гарантируют определенный класс размера окна. Пространство экрана, доступное вашему приложению, может отличаться от размера экрана устройства по многим причинам. На мобильных устройствах режим разделенного экрана позволяет разделить экран между двумя приложениями. В ChromeOS приложения Android могут быть представлены в окнах произвольной формы, размер которых можно произвольно изменять. Складные устройства могут иметь два экрана разного размера, к которым можно получить индивидуальный доступ, складывая или раскладывая устройство.

• Класс размера окна может меняться на протяжении всего времени существования вашего приложения. Во время работы вашего приложения изменение ориентации устройства, многозадачность, а также складывание/раскладывание могут изменить объем доступного места на экране. В результате класс размера окна является динамическим, и пользовательский интерфейс вашего приложения должен адаптироваться соответствующим образом.

Классы размеров окон сопоставляются с компактными, средними и расширенными точками останова в руководстве по макету Material Design . Используйте классы размеров окон для принятия решений по макету приложения на высоком уровне, например, при принятии решения о том, следует ли использовать конкретный канонический макет, чтобы использовать дополнительное пространство экрана.

Вычислите текущий WindowSizeClass с помощью функции верхнего уровня currentWindowAdaptiveInfo() библиотеки androidx.compose.material3.adaptive . Функция возвращает экземпляр WindowAdaptiveInfo , который содержит windowSizeClass . В следующем примере показано, как вычислить класс размера окна и получать обновления при каждом изменении класса размера окна:

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

Управление макетами с помощью классов размеров окон

Классы размеров окон позволяют изменять макет приложения по мере изменения пространства отображения, доступного для вашего приложения, например, когда устройство складывается или разворачивается, меняется ориентация устройства или изменяется размер окна приложения в многооконном режиме.

Локализуйте логику обработки изменений размера дисплея, передав классы размера окна в качестве состояния вложенным составным объектам, как и любое другое состояние приложения:

@OptIn(ExperimentalMaterial3AdaptiveApi::class)
@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

Классы размеров тестовых окон

При внесении изменений в макет проверяйте поведение макета во всех размерах окон, особенно при компактной, средней и расширенной ширине точки останова.

Если у вас есть макет для компактных экранов, сначала оптимизируйте его для класса размеров с расширенной шириной, поскольку этот класс размеров предоставляет больше места для дополнительного контента и изменений пользовательского интерфейса. Затем решите, какой макет имеет смысл для класса размеров средней ширины; рассмотрите возможность добавления специализированного макета.

Следующие шаги

Чтобы узнать больше о том, как использовать классы размеров окон для создания адаптивных макетов, см. следующее:

• Для макетов на основе Compose: поддержка разных размеров экрана.

• Для макетов на основе представлений: адаптивный дизайн с представлениями.

Чтобы узнать больше о том, что делает приложение отличным на всех устройствах и размерах экрана, см.:

• Перенесите свой пользовательский интерфейс на адаптивные макеты
• Качество приложения на большом экране