El agente de IA está equipado de forma única para ayudarte a hacer realidad tu visión de la IU de la app para Android con Jetpack Compose y siguiendo las prácticas recomendadas de Android. En esta página, se describe cómo crear y mejorar la IU de una app con IA.
Para generar una IU con IA, sigue estos pasos generales:
Crea una maqueta de la IU de la app que deseas. Puedes exportar un PNG desde una herramienta de diseño o incluso usar una imagen dibujada a mano.
Figura 1: Esquema de página de la interfaz de usuario de una app. Para adjuntar la imagen a tu búsqueda, haz clic en el botón Adjuntar archivo de imagen
. También puedes hacer clic en Generate Code From Screenshot directamente desde el panel Preview en un archivo sin una vista previa existente.
Figura 2: Genera código a partir de una captura de pantalla en un panel de vista previa vacío. En el campo de chat, pídele al agente de IA que genere el código de la IU, por ejemplo, "Genera código de Jetpack Compose para la imagen proporcionada". Cuando envías la búsqueda y la imagen, el agente de IA sugiere código para crear la IU propuesta. Por lo general, el agente de IA también proporciona el código para la vista previa de Compose, de modo que puedas visualizar rápidamente la IU una vez que la importes a tu proyecto. Si no lo hace, pídele que genere las vistas previas de Compose.
Figura 2: Gemini genera código de Jetpack Compose a partir de una imagen adjunta. Una vez que importes el código y puedas ver la vista previa de Compose en el panel de vista previa, puedes iterar en la IU haciendo clic directamente en la vista previa y pidiéndole a Gemini que la transforme. Si tienes una imagen de lo que quieres, también puedes iterar en la IU haciendo clic con el botón derecho en la vista previa y seleccionando Acciones de IA > Coincidir la IU con la imagen objetivo.
Figura 5: Uso de Gemini para transformar elementos de la IU directamente desde la vista previa de Compose. 
Figura 6: Ejemplo del uso de "Match UI to Target Image"
Cómo encontrar y corregir problemas de calidad de la IU
El agente de IA también puede ayudarte a garantizar que tu IU sea de alta calidad y accesible. Haz clic con el botón derecho en la vista previa de Compose y selecciona Acciones de IA > Corregir todos los problemas de la verificación de la IU. El agente audita tu IU en busca de problemas comunes, como problemas de accesibilidad, y propone correcciones de código para resolverlos.
