Generowanie interfejsu z załącznikami w postaci obrazów
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Gemini w Android Studio to wyjątkowe narzędzie, które pomoże Ci zrealizować wizję interfejsu aplikacji na Androida przy użyciu Jetpack Compose i zgodnie ze sprawdzonymi metodami dotyczącymi Androida.
Na tej stronie opisano ogólne kroki tworzenia interfejsu aplikacji za pomocą Gemini. Więcej informacji o załączaniu obrazów i innych pomysłach na wykorzystanie tej funkcji znajdziesz w artykule Załączanie obrazu do zapytania.
Aby wygenerować interfejs za pomocą Gemini, wykonaj te ogólne czynności:
Utwórz makietę interfejsu aplikacji, która Cię interesuje. Najlepiej sprawdzi się szkielet lub podstawowy projekt. Możesz wyeksportować plik PNG z narzędzia do projektowania lub użyć nawet odręcznego rysunku.
Dołącz obraz do zapytania, klikając Dołącz plik obrazu.
W polu czatu poproś Gemini o wygenerowanie kodu interfejsu, np. „Wygeneruj kod Jetpack Compose dla podanego obrazu”. Gdy prześlesz zapytanie i obraz, Gemini zaproponuje kod do utworzenia proponowanego interfejsu. Gemini zwykle podaje też kod podglądu Compose, dzięki czemu po zaimportowaniu go do projektu możesz szybko zwizualizować interfejs. Jeśli tak się nie stanie, poproś o wygenerowanie podglądów Compose.
Po zaimportowaniu kodu i wyświetleniu podglądu kompozycji w panelu podglądu możesz iteracyjnie tworzyć interfejs, klikając bezpośrednio podgląd i prosząc Gemini o jego przekształcenie.
Treść strony i umieszczone na niej fragmenty kodu podlegają licencjom opisanym w Licencji na treści. Java i OpenJDK są znakami towarowymi lub zastrzeżonymi znakami towarowymi należącymi do firmy Oracle lub jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-31 UTC.
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 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)."]]