Искусственный интеллект обладает уникальными возможностями, чтобы помочь вам воплотить в жизнь ваше видение пользовательского интерфейса Android-приложения, используя Jetpack Compose и следуя лучшим практикам Android. На этой странице описывается, как создавать и дорабатывать пользовательский интерфейс приложения с помощью ИИ.
Для создания пользовательского интерфейса с использованием ИИ выполните следующие общие шаги:
Создайте макет желаемого пользовательского интерфейса приложения. Вы можете экспортировать изображение в формате PNG из инструмента для дизайна или даже использовать рисунок, нарисованный от руки.
Рисунок 1: Макет пользовательского интерфейса приложения. Прикрепите изображение к своему запросу, нажав кнопку «Прикрепить файл изображения» .
Вы также можете нажать кнопку «Сгенерировать код из скриншота» непосредственно на панели предварительного просмотра в файле, для которого нет существующего предварительного просмотра. 
Рисунок 2: Генерация кода из скриншота в пустой панели предварительного просмотра. В поле чата попросите ИИ сгенерировать код пользовательского интерфейса, например: «Сгенерировать код Jetpack Compose для предоставленного изображения». После отправки запроса и изображения ИИ-агент предложит код для создания предлагаемого пользовательского интерфейса. Обычно ИИ-агент также предоставляет код для предварительного просмотра в Compose , поэтому вы можете быстро визуализировать пользовательский интерфейс после импорта в свой проект — если этого нет, попросите его сгенерировать предварительный просмотр в Compose .
Рисунок 2: Gemini генерирует код Jetpack Compose на основе прикрепленного изображения. После импорта кода и появления предварительного просмотра Compose на панели предварительного просмотра, вы можете вносить изменения в пользовательский интерфейс, щелкая непосредственно по предварительному просмотру и запрашивая у Gemini его преобразование . Если у вас есть изображение желаемого результата, вы также можете вносить изменения в пользовательский интерфейс, щелкнув правой кнопкой мыши по предварительному просмотру и выбрав «Действия ИИ» > «Сопоставить пользовательский интерфейс с целевым изображением» .
Рисунок 5: Использование Gemini для преобразования элементов пользовательского интерфейса непосредственно из предварительного просмотра в окне Compose. 
Рисунок 6: Пример использования функции "Сопоставление пользовательского интерфейса с целевым изображением"
Выявление и устранение проблем с качеством пользовательского интерфейса.
Агент на основе ИИ также может помочь вам обеспечить высокое качество и доступность вашего пользовательского интерфейса. Щелкните правой кнопкой мыши на предварительном просмотре Compose и выберите «Действия ИИ» > «Исправить все проблемы проверки пользовательского интерфейса» . Агент проверит ваш пользовательский интерфейс на наличие распространенных проблем, таких как проблемы с доступностью, и предложит исправления кода для их устранения.
