Jetpack Compose Glimmer создан на основе Jetpack Compose и включает в себя компонуемые объекты, компоненты, модели поведения и тему, разработанные для очков ИИ с дисплеем . С Glimmer вы можете создавать собственный пользовательский интерфейс для очков ИИ с помощью Compose, воплощая в жизнь ваши приложения с меньшим объёмом кода, мощными инструментами и интуитивно понятными API Kotlin.
Композитные материалы Jetpack Compose Glimmer
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 для поддержки таких методов ввода, как касание и свайп по умолчанию.
Более подробную информацию об использовании конкретного компонента см. в следующих руководствах:
Если один из этих высокоуровневых компонентов не подходит для вашего случая, вы можете создать собственный компонент с помощью surface . Поверхности — это базовый строительный блок в Jetpack Compose Glimmer, своего рода чистый холст для любых специальных дизайнов или взаимодействий, которые вы хотите реализовать.
Модификаторы Jetpack Compose Glimmer
Модификаторы в Jetpack Compose Glimmer работают идентично модификаторам Compose , позволяя дополнять компонуемые элементы, настраивая их расположение, внешний вид и поведение. Jetpack Compose Glimmer может добавлять специальные модификаторы или применять уникальные значения по умолчанию для визуальной обратной связи и производительности, специфичных для очков.
Jetpack Compose Мерцающая глубина
Компоненты Jetpack Compose Glimmer используют глубину для представления иерархии, что помогает визуально различать элементы, отображаемые поверх других карточек. Глубина в очках ИИ — это сочетание положения в z-пространстве и теней. Для большинства высокоуровневых компонентов, таких как элементы списка, глубина применяется автоматически в зависимости от состояния фокуса. Когда компонент находится в фокусе, он приобретает глубину; когда теряет фокус, он возвращается в нормальное состояние. Однако для работы с пользовательскими компонентами можно использовать параметр глубины в Modifier.surface или Modifier.depth .
Тема Jetpack Compose от Glimmer
Jetpack Compose Glimmer предлагает специальную систему тем оформления для очков с искусственным интеллектом. Тема Jetpack Compose Glimmer реализует упрощённую и оптимизированную палитру цветов, типографики и форм. Это обеспечивает максимальную наглядность и лаконичность очков с искусственным интеллектом. Все компоненты Jetpack Compose Glimmer разработаны для автоматической интеграции со специфическими методами ввода очков с искусственным интеллектом. Тема Jetpack Compose Glimmer реализуется с помощью класса GlimmerTheme .
Как и другие темы Jetpack Compose , GlimmerTheme включает в себя несколько подсистем: цвета, формы, типографику и значки (символику). Тема Jetpack Compose Glimmer также включает в себя компоненты Jetpack Compose Glimmer , которые можно настраивать.
Цвета
Цветовая система Jetpack Compose Glimmer включает семь цветов в оптимизированной палитре, разработанной для максимальной видимости и четкости на дисплеях очков ИИ, где черные значения не отображаются.
GlimmerTheme . Обратите внимание, что цвета «On ...» не отображаются в GlimmerTheme . Эти цвета автоматически рассчитываются системой на основе цвета фона.
Эти цвета отображаются через GlimmerTheme.colors.primary со значениями для каждой цветовой роли, как описано в следующей таблице:
Роль цвета | Настройки по умолчанию |
|---|---|
начальный | #A8C7FA |
вторичный | #4C88E9 |
положительный | #4CE995 |
отрицательный | #F57084 |
поверхность | #000000 |
контур | #606460 |
outlineVariant | #42434A |
Обратите внимание, что хотя surface , outline и outlineVariant помечены как настраиваемые, мы настоятельно рекомендуем вам не настраивать эти значения.
Формы
Система форм Jetpack Compose Glimmer определяет набор стандартных угловых обработок и геометрических форм для компонентов, разработанных для создания последовательного и минималистичного визуального языка в интерфейсах очков ИИ, при этом все формы отображаются через GlimmerTheme.shapes .
Типографика
Система типографики Jetpack Compose Glimmer включает шесть стилей для удобства чтения и лаконичности на экранах очков с искусственным интеллектом. Эти стили разработаны для максимального контраста и улучшения читаемости текста за счёт более жирного шрифта, увеличенного межбуквенного интервала и оптимальной высоты строк. Эти стили доступны через GlimmerTheme.typography .
Иконки
Система иконок Jetpack Compose Glimmer разработана для последовательной интеграции с упрощенным визуальным языком пользовательского интерфейса очков ИИ, часто используя округлые формы, такие как Material Symbols Rounded, для оптимальной читаемости.