A medida que desarrollas la IU de Glimmer de Jetpack Compose, usa vistas previas de elementos componibles para visualizar tus diseños y realizar iteraciones en ellos de forma rápida y eficiente. Las vistas previas de elementos componibles te brindan una renderización interactiva y en vivo de los componentes de la IU de Glimmer de Jetpack Compose directamente en Android Studio. Estas vistas previas eliminan la necesidad de compilar y ejecutar continuamente tu app en un emulador o dispositivo físico para cada pequeño cambio en la IU, lo que acelera drásticamente tu ciclo de desarrollo.
Obtén una vista previa de los componentes de la IU de Glimmer de Jetpack Compose
- Abre tu proyecto de XR en la compilación de Canary más reciente de Android Studio.
- Verifica que tu función de componibilidad tenga la anotación
@Preview. En la vista Code, haz clic en el selector de configuración de vista previa de la función de componibilidad.
En el menú desplegable Dispositivo, selecciona Lentes con IA.
Esto ajusta la superficie de la vista previa para que coincida con la resolución y la relación de aspecto únicas de los lentes con pantalla.
Selecciona la vista Design o Split para ver la vista previa.
Ajusta el entorno de vista previa
Los lentes usan una pantalla aditiva y transparente. Esta característica significa que la pantalla solo puede agregar luz, no puede crear negro. Con una pantalla aditiva, el negro no es un color, sino que aparece 100% transparente. La vista previa de Compose proporciona una aproximación que te ayuda a comprender cómo se comporta la IU en diferentes condiciones de visualización.
Para simular diferentes condiciones de visualización, haz clic en el ícono de entorno en la barra de herramientas del panel de vista previa. Prueba diferentes opciones de fondo (por ejemplo, Claro, Oscuro o Concurrido) para verificar si el texto y los componentes tienen el contraste y la visibilidad adecuados.