Просмотрите свой Jetpack Compose Glimmer UI с помощью компонуемых предпросмотров

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

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

См. также
Если вы новичок в использовании компонуемых предварительных просмотров в разработке под Android, ознакомьтесь с общей документацией по Compose.

Предварительный просмотр компонентов пользовательского интерфейса Jetpack Compose Glimmer

  1. Откройте свой XR-проект в последней сборке Android Studio Canary.
  2. Убедитесь, что ваша составная функция аннотирована аннотацией @Preview .

  3. В режиме просмотра кода щелкните выбора конфигурации предварительного просмотра для составной функции.

  4. В выпадающем меню «Устройство» выберите «AI Glasses» .

    Эта функция подстраивает поверхность предварительного просмотра под уникальное разрешение и соотношение сторон дисплеев.

    Выберите «AI Glasses» для устройства в предварительном просмотре составной функции конфигурации.

  5. Для просмотра предварительного просмотра выберите режим «Дизайн» или «Разделенный экран».

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

Настройте среду предварительного просмотра.

В очках используется аддитивный, прозрачный дисплей. Эта характеристика означает, что дисплей может только добавлять свет; он не может создавать черный цвет. В аддитивном дисплее черный цвет не является цветом — он выглядит на 100% прозрачным. Предварительный просмотр в Compose предоставляет приблизительное представление, которое помогает понять, как ведет себя пользовательский интерфейс в различных условиях просмотра.

Чтобы имитировать различные условия просмотра, щелкните значок окружения на панели инструментов области предварительного просмотра. Попробуйте разные варианты фона (например, «Светлый», «Темный» или «Насыщенный»), чтобы проверить, достаточно ли контраста и видимости у вашего текста и компонентов.