Экосистема Wear OS состоит из устройств с экранами самых разных размеров. Использование принципов адаптивного пользовательского интерфейса имеет решающее значение для обеспечения высочайшего качества для всех пользователей.
Что такое адаптивный интерфейс?
Адаптивные пользовательские интерфейсы растягиваются и изменяются, чтобы максимально эффективно использовать все доступное пространство экрана, независимо от размера экрана, на котором они отображаются.
Адаптивные пользовательские интерфейсы быстро изменяются, используя компоненты и методы, встроенные непосредственно в логику макета. В этих макетах также используются контрольные точки размера экрана — применение разного дизайна для экранов разных размеров — чтобы создать еще более богатый опыт для пользователей.
Основные размеры экрана
![](https://developer.android.google.cn/static/wear/images/design/key-screen-sizes.png?authuser=8&hl=ru)
Узнайте об основных эталонных размерах, которые следует учитывать при разработке новых возможностей.
Виды планировок
При разработке адаптивных макетов на круглом экране каждое представление с прокруткой и без прокрутки предъявляет уникальные требования к масштабированию элементов пользовательского интерфейса и поддержанию сбалансированного макета и композиции.
![](https://developer.android.google.cn/static/wear/images/design/scrolling-view.gif?authuser=8&hl=ru)
Все верхние, нижние и боковые поля должны быть определены в процентах, чтобы избежать обрезки и обеспечить пропорциональное масштабирование элементов.
![](https://developer.android.google.cn/static/wear/images/design/non-scrolling-view.gif?authuser=8&hl=ru)
Все поля должны быть определены в процентах, а ограничения по вертикали должны быть определены таким образом, чтобы основной контент в середине мог растягиваться и заполнять доступную область.
Повысьте ценность с помощью адаптивных макетов и методов проектирования.
При разработке адаптивных макетов на круглом экране каждое представление с прокруткой и без прокрутки предъявляет уникальные требования к масштабированию элементов пользовательского интерфейса и поддержанию сбалансированного макета и композиции.
Следующие изображения представляют собой общие рекомендации; примеры предназначены только для иллюстративных целей. Просмотрите каждый компонент или поверхностную страницу для получения подробных, контекстуальных и оперативных инструкций.
![](https://developer.android.google.cn/static/wear/images/design/content-at-a-glance.png?authuser=8&hl=ru)
Адаптивные макеты позволяют разместить больше фишек, карточек, строк текста и кнопок на одном экране.
![](https://developer.android.google.cn/static/wear/images/design/content-elements-visible.png?authuser=8&hl=ru)
Используйте новые макеты, применяемые в контрольных точках определенного размера экрана, чтобы обеспечить возможность добавления нового контента, когда это возможно, предоставляя пользователю дополнительную выгоду на устройствах с экранами большего размера.
![](https://developer.android.google.cn/static/wear/images/design/glanceability.png?authuser=8&hl=ru)
Используйте дополнительное пространство экрана, чтобы обеспечить более крупные контейнеры, более крупный текст, более толстые кольца и более детальную визуализацию данных, чтобы обеспечить лучшую видимость для пользователей.
![](https://developer.android.google.cn/static/wear/images/design/usability.png?authuser=8&hl=ru)
Используйте дополнительное пространство экрана, чтобы обеспечить более крупные цели касания, большую визуальную иерархию и дополнительное пространство между элементами контента, чтобы сделать интерфейсы более простыми и удобными для взаимодействия.
![](https://developer.android.google.cn/static/wear/images/design/optimized-compositions.png?authuser=8&hl=ru)
Используйте наши обновленные компоненты и шаблоны, чтобы улучшить внешний вид наших пользовательских интерфейсов на экранах всех размеров.
Качество приложения
![](https://developer.android.google.cn/static/wear/images/design/quality-guidelines.png?authuser=8&hl=ru)
Наши рекомендации по качеству разделены на три уровня. Обеспечьте максимальное удобство для своих пользователей, соблюдая рекомендации на всех трех уровнях.
Готов для всех размеров экрана | Адаптивный и оптимизированный | Адаптивный и дифференцированный |
Используйте устоявшиеся канонические макеты
![](https://developer.android.google.cn/static/wear/images/design/canonical-layouts.png?authuser=8&hl=ru)
Используйте устоявшиеся канонические макеты, чтобы ваши пользовательские интерфейсы плавно адаптировались к устройствам разных размеров.
Наши канонические макеты были тщательно разработаны, чтобы обеспечить высокое качество изображения на экранах всех размеров.