Создание пользовательского интерфейса с прикрепленными изображениями
Оптимизируйте свои подборки
Сохраняйте и классифицируйте контент в соответствии со своими настройками.
Gemini в Android Studio — это уникальный инструмент, который поможет вам воплотить в жизнь вашу идею пользовательского интерфейса приложения для Android, используя Jetpack Compose и следуя рекомендациям Android. На этой странице описаны общие шаги по созданию пользовательского интерфейса приложения с помощью Gemini. Подробнее о прикреплении изображений и других идеях использования этой функции см. в статье «Прикрепить изображение к запросу» .
Чтобы создать пользовательский интерфейс с помощью Gemini, выполните следующие общие шаги:
Создайте макет желаемого пользовательского интерфейса приложения. Лучше всего подойдет каркасный или базовый дизайн. Вы можете экспортировать PNG-файл из дизайнерского инструмента или даже использовать нарисованное от руки изображение.
Прикрепите изображение к вашему запросу, нажав «Прикрепить файл изображения». .
В поле чата попросите Gemini сгенерировать код пользовательского интерфейса, например, «Сгенерировать код Jetpack Compose для предоставленного изображения». После отправки запроса и изображения Gemini предложит код для создания предлагаемого пользовательского интерфейса. Обычно Gemini также предоставляет код для предварительного просмотра Compose , чтобы вы могли быстро визуализировать пользовательский интерфейс после импорта в свой проект. Если же этого не происходит, попросите Gemini сгенерировать предварительные просмотры Compose .
После импорта кода и появления предварительного просмотра Compose на панели предварительного просмотра вы можете вносить изменения в пользовательский интерфейс, щелкнув непосредственно по предварительному просмотру и попросив Gemini преобразовать его .
Контент и образцы кода на этой странице предоставлены по лицензиям. Java и OpenJDK – это зарегистрированные товарные знаки корпорации Oracle и ее аффилированных лиц.
Последнее обновление: 2025-07-31 UTC.
[[["Прост для понимания","easyToUnderstand","thumb-up"],["Помог мне решить мою проблему","solvedMyProblem","thumb-up"],["Другое","otherUp","thumb-up"]],[["Отсутствует нужная мне информация","missingTheInformationINeed","thumb-down"],["Слишком сложен/слишком много шагов","tooComplicatedTooManySteps","thumb-down"],["Устарел","outOfDate","thumb-down"],["Проблема с переводом текста","translationIssue","thumb-down"],["Проблемы образцов/кода","samplesCodeIssue","thumb-down"],["Другое","otherDown","thumb-down"]],["Последнее обновление: 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)."]]