Agent AI jest doskonale przygotowany do tego, aby pomóc Ci zrealizować Twoją wizję interfejsu aplikacji na Androida, korzystając z Jetpack Compose i postępując zgodnie ze sprawdzonymi metodami Androida. Na tej stronie znajdziesz informacje o tym, jak tworzyć i ulepszać interfejs aplikacji za pomocą AI.
Aby wygenerować interfejs za pomocą AI, wykonaj te ogólne czynności:
Utwórz makietę interfejsu aplikacji, który chcesz uzyskać. Możesz wyeksportować plik PNG z narzędzia do projektowania lub użyć nawet odręcznego rysunku.
Ilustracja 1. Szkic interfejsu użytkownika aplikacji. Dołącz obraz do zapytania, klikając przycisk Dołącz plik obrazu.
Możesz też kliknąć Wygeneruj kod na podstawie zrzutu ekranu bezpośrednio w panelu Podgląd w pliku bez istniejącego podglądu.
Rysunek 2. Generowanie kodu na podstawie zrzutu ekranu w pustym panelu Podgląd. W polu czatu poproś agenta AI o wygenerowanie kodu interfejsu, np. „Wygeneruj kod Jetpack Compose dla podanego obrazu”. Gdy prześlesz zapytanie i obraz, agent AI zaproponuje kod do utworzenia proponowanego interfejsu. Agent AI 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ś go o wygenerowanie podglądów Compose.
Ilustracja 2. Gemini generuje kod Jetpack Compose na podstawie załączonego obrazu. Po zaimportowaniu kodu i wyświetleniu podglądu funkcji Compose w panelu podglądu możesz iteracyjnie tworzyć interfejs, klikając bezpośrednio podgląd i prosząc Gemini o jego przekształcenie. Jeśli masz obraz tego, co chcesz uzyskać, możesz też iteracyjnie zmieniać interfejs, klikając prawym przyciskiem myszy podgląd i wybierając Działania AI > Dopasuj interfejs do obrazu docelowego.
Ilustracja 5. Używanie Gemini do przekształcania elementów interfejsu bezpośrednio z podglądu Compose. 
Ilustracja 6. Przykład użycia funkcji „Dopasuj interfejs do obrazu docelowego”
Wykrywanie i rozwiązywanie problemów z jakością interfejsu
Agent AI może też pomóc Ci zadbać o wysoką jakość i dostępność interfejsu. Kliknij prawym przyciskiem myszy podgląd kompozycji i wybierz Działania AI > Rozwiąż wszystkie problemy z interfejsem. Agent sprawdza interfejs użytkownika pod kątem typowych problemów, takich jak problemy z dostępnością, i proponuje poprawki kodu, aby je rozwiązać.
