Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Gemini en Android Studio está equipado de forma única para ayudarte a hacer realidad tu visión de la IU de la app para Android, usando Jetpack Compose y siguiendo las prácticas recomendadas de Android.
En esta página, se describen los pasos generales para crear la IU de una app con Gemini. Para obtener más información sobre cómo adjuntar imágenes y otras ideas para usar la función, consulta Cómo adjuntar una imagen a tu búsqueda.
Para generar una IU con Gemini, sigue estos pasos generales:
Crea una maqueta de la IU de la app que deseas. Un esquema o un diseño básico son los más adecuados. Puedes exportar un PNG desde una herramienta de diseño o incluso usar una imagen dibujada a mano.
Para adjuntar la imagen a tu búsqueda, haz clic en Adjuntar archivo de imagen.
En el campo de chat, pídele a Gemini que genere el código de la IU, por ejemplo, "Genera código de Jetpack Compose para la imagen proporcionada". Cuando envías la consulta y la imagen, Gemini sugiere código para crear la IU propuesta. Por lo general, Gemini también proporciona el código para la vista previa de Compose, de modo que puedes visualizar rápidamente la IU una vez que la importas a tu proyecto. Si no lo hace, pídele que genere las vistas previas de Compose.
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.
El contenido y las muestras de código que aparecen en esta página están sujetas a las licencias que se describen en la Licencia de Contenido. Java y OpenJDK son marcas registradas de Oracle o sus afiliados.
Última actualización: 2025-07-31 (UTC)
[null,null,["Última actualización: 2025-07-31 (UTC)"],[],[],null,["# Generate UI with image attachments\n\n| **Preview:** Enable image attachment through [Studio Labs](/studio/gemini/attach-image).\n| **Note:** Image attachment is currently available in Gemini's no-cost tier.\n\nGemini in Android Studio is uniquely equipped to help you make your Android app\nUI vision a reality, using Jetpack Compose and following Android best practices.\nThis page describes the general steps to creating an app UI with Gemini. For\nmore information about image attachment and other ideas for how to use the\nfeature, see [Attach an image to your query](/studio/gemini/attach-image).\n\nTo generate a UI with Gemini, follow these general steps:\n\n1. Create a mockup of the app UI that you want. A wireframe or basic design\n works best. You can export a PNG from a design tool or even use a hand drawn\n image.\n\n2. Attach the image to your query by clicking **Attach image file**\n .\n\n3. In the chat field, ask Gemini to generate the UI code, for example \"Generate\n Jetpack Compose code for the image provided.\" When you submit the query and\n image, Gemini suggests code to create the proposed UI. Gemini usually\n provides the code for the\n [Compose preview](/develop/ui/compose/tooling/previews) too, so you can\n quickly visualize the UI once you import the into your project---if it doesn't,\n ask it to\n [generate Compose the previews](/studio/gemini/generate-compose-previews).\n\n4. Once you import the code and can see the Compose preview in the preview\n panel, you can iterate on the UI by clicking directly on the preview and\n [asking Gemini to transform it](/studio/gemini/transform-ui)."]]