Макеты приложений

Попробуйте способ создания композиций.
Jetpack Compose на Wear OS — это рекомендуемый набор инструментов для создания пользовательского интерфейса для Wear OS.

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

К распространенным вариантам компоновки приложений относятся следующие:

  • Одноэкранный (простейший) вариант: элементы пользовательского интерфейса ограничены тем, что видно одновременно без прокрутки.
  • Вертикальный контейнер (наиболее распространенный): контент находится за пределами видимой части экрана и доступен при прокрутке.
  • Другие опции: списки, постраничная навигация или 2D-прокрутка.

Эти типы компоновки описаны в следующих разделах. При необходимости использования нескольких экранов можно использовать комбинацию типов компоновки.

Примечание: Для вашей активности наследуйте либо ComponentActivity , либо, если вы используете фрагменты, FragmentActivity . Другие типы активностей используют элементы пользовательского интерфейса, специфичные для мобильных устройств, которые вам не нужны для Wear OS.

Один экран

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

Рисунок 1. Пример компоновки на одном экране.

Для организации элементов на одном экране хорошо подходит комбинация BoxInsetLayout и ConstraintLayout .

Вертикальный контейнер

Вертикальный контейнер — наиболее распространенный тип компоновки приложений. Часть контента не видна на экране, но к ней можно получить доступ с помощью прокрутки.

На рисунке 2 показаны несколько полных макетов приложений, в которых на круглом экране часов видна лишь часть контента. В этих примерах основной контент находится в верхней части контейнера, а другие важные пользовательские сценарии (CUJ) и настройки — в нижней. Это является лучшей практикой размещения контента.

Рисунок 2. Примеры вертикальной компоновки контейнеров.

В отличие от одноэкранной компоновки приложения, не используйте BoxInsetLayout . Вместо этого используйте ConstraintLayout внутри NestedScrollView . Внутри ConstraintLayout разместите те виджеты, которые наиболее подходят для вашего приложения. Это позволит вам использовать дополнительное пространство по бокам круглого экрана.

Рисунок 3. Содержимое ConstraintLayout внутри NestedScrollView .

Убедитесь, что содержимое в верхней и нижней части вертикального контейнера достаточно мало, чтобы поместиться в верхней и нижней части круглого дисплея, как в примере на рисунке 3.

Примечание: По возможности добавьте индикатор прокрутки в ваш NestedScrollView , установив в XML-файле параметр android:scrollbars="vertical" . Это поможет пользователям определить, что доступен дополнительный контент, и оценить свое положение относительно всего контента.

Другие варианты компоновки приложений

  • Списки : отображение больших наборов данных с помощью виджета WearableRecyclerView , оптимизированного для носимых устройств. Для получения дополнительной информации см. раздел «Создание списков в Wear OS» .
  • Горизонтальная постраничная навигация : для сценариев использования с несколькими соседними экранами используйте горизонтальный свайп . При использовании горизонтальной постраничной навигации необходимо поддерживать свайп для закрытия левого края.
  • Панорамирование в 2D : в таких случаях, как работа с картами, пользователи могут перетаскивать курсор для перемещения в разных направлениях. Включите функцию закрытия с помощью свайпа, если ваше действие занимает весь экран.