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

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

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

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

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

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

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

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

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

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
AdaptiveLayoutSnippets.kt

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

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

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

@Composable
fun MyApp(
    windowSizeClass: WindowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
) {
    // Decide whether to show the top app bar based on window size class.
    val showTopAppBar = windowSizeClass.isHeightAtLeastBreakpoint(WindowSizeClass.HEIGHT_DP_MEDIUM_LOWER_BOUND)

    // MyScreen logic is based on the showTopAppBar boolean flag.
    MyScreen(
        showTopAppBar = showTopAppBar,
        /* ... */
    )
}
AdaptiveLayoutSnippets.kt

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

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

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

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

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

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

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

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

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