Что входит в Jetpack Compose Glimmer

Применимые устройства XR
Данное руководство поможет вам создавать приложения для устройств XR такого типа.
Узнайте о типах устройств XR →
Очки для демонстрации
Узнайте о типах устройств XR →

Jetpack Compose Glimmer создан на основе Jetpack Compose и включает в себя компонуемые элементы, компоненты, поведение и тему, разработанные для очков с искусственным интеллектом и дисплеем . С помощью Glimmer вы можете создавать нативный пользовательский интерфейс для очков с дисплеем, используя Compose, оживляя возможности вашего приложения с помощью меньшего количества кода, мощных инструментов и интуитивно понятных API Kotlin.

Jetpack Compose Glimmer composables

Jetpack Compose Glimmer предоставляет функции @Composable специально разработанные для отображения в очках с искусственным интеллектом, такие как Text , Button и ListItem . Вот некоторые уникальные характеристики компонуемых элементов Jetpack Compose Glimmer:

  • Упрощенный стиль : например, для компонентов Surface по умолчанию используется черный или прозрачный фон для оптимизации оптического отображения.
  • Оптимизированные цветовые настройки по умолчанию : Jetpack Compose Glimmer по умолчанию вычисляет цвет содержимого на основе цвета фона, поэтому разработчикам редко приходится вручную устанавливать цвета текста, что повышает читаемость без каких-либо дополнительных усилий.

  • Дифференцированная фокусировка : Фокусировка обозначается с помощью визуальной обратной связи в виде контура, а не эффекта ряби, что обеспечивает четкую видимость.

    Рисунок 1. Три состояния фокусировки в Jetpack Compose Glimmer, которые различаются с помощью визуальной обратной связи на основе контура.

  • Оптимизированная высота : Jetpack Compose Glimmer использует ограниченное количество теней для визуального разделения.

    Рисунок 2. Пять уровней высоты в Jetpack Compose Glimmer, которые различаются с помощью ограниченного количества теней от прямоугольников.

Компоненты Jetpack Compose Glimmer

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

Рисунок 3. Jetpack Compose Glimmer включает в себя множество компонентов, которые помогут вам создавать приложения, оптимизированные для экранных очков.

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

Если один из этих высокоуровневых компонентов не подходит для вашего случая, вы можете использовать surface для создания пользовательского компонента. Поверхности — это самый базовый строительный блок в Jetpack Compose Glimmer — чистый холст для любых конкретных, пользовательских дизайнов или взаимодействий, которые вы хотите создать.

Модификаторы Jetpack Compose Glimmer

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

Jetpack Compose Тема Глиммер

Jetpack Compose Glimmer имеет специальную систему оформления для очков отображения. Тема Jetpack Compose Glimmer использует упрощенную и оптимизированную палитру цветов, типографики и форм. Это обеспечивает максимальную видимость и лаконичность для очков отображения. Все компоненты Jetpack Compose Glimmer разработаны для автоматической интеграции со специфическими для очков методами ввода. Тема Jetpack Compose Glimmer предоставляется через класс GlimmerTheme .

Как и другие темы в Jetpack Compose , GlimmerTheme включает в себя несколько подсистем, которые кратко описаны в следующих разделах вместе с их настраиваемыми атрибутами:

  • Цвета
  • Типография
  • Значения расстояния между компонентами
  • Формы
  • Уровни эффекта глубины
  • Размеры иконок

Цвета

Цветовая система Jetpack Compose Glimmer разработана для аддитивных дисплеев и реальных условий окружающей среды. В отличие от стандартных тем Android, GlimmerTheme Colors отдает приоритет темным фонам с полупрозрачностью и ярким акцентам, чтобы обеспечить читаемость контента при непредсказуемом освещении в реальных условиях.

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

Рисунок 4. Обзор цветовой гаммы в GlimmerTheme .

Типография

Система типографики Jetpack Compose Glimmer включает в себя различные стили для улучшения читаемости и лаконичности на экранах с дисплеями. Эти стили разработаны для максимального повышения контраста и улучшения читаемости текста за счет более жирного шрифта, большего межбуквенного расстояния и соответствующей высоты строк. Доступ к этим стилям осуществляется через GlimmerTheme.typography .

Рисунок 5. Пример шести типографских стилей Jetpack Compose Glimmer.

Значения расстояния между компонентами

Эти значения используются для обеспечения единообразного расстояния между компонентами Jetpack Compose Glimmer. Это включает в себя отступы компонентов, расстояние между компонентами и другие элементы, определяющие расстояние. Обратите внимание, что изменение этих значений влияет на размер большинства компонентов по умолчанию.

Формы

Система форм Jetpack Compose Glimmer определяет набор стандартных вариантов обработки углов и геометрических форм для компонентов, предназначенных для создания согласованного и минималистичного визуального языка в интерфейсах очков отображения, при этом все формы доступны через GlimmerTheme.shapes .

Рисунок 6. Пример больших, средних и малых фигур в Jetpack Compose Glimmer.

Уровни эффекта глубины

Компоненты Jetpack Compose Glimmer используют глубину для представления иерархии, что помогает визуально различать элементы, отображаемые поверх других карточек. Глубина на дисплеях — это сочетание размещения в z-пространстве и теней. Для большинства высокоуровневых компонентов, таких как элементы списка, глубина применяется автоматически в зависимости от состояния фокуса. Когда компонент находится в фокусе, он получает глубину; когда он теряет фокус, он возвращается в свое нормальное состояние. Однако для работы с пользовательскими компонентами можно использовать параметр depthEffect в Modifier.surface или depthEffect .

Размеры иконок

Система иконок Jetpack Compose Glimmer разработана для гармоничной интеграции с упрощенным визуальным языком пользовательских интерфейсов очков отображения, часто используя закругленные формы, такие как Material Symbols Rounded, для оптимальной читаемости.