Hängen Sie ein Bild an Ihre Anfrage an, damit der Agent die Architektur einer App besser versteht und den Prozess der UI-Entwicklung beschleunigen kann.
Wenn Sie Ihrem Prompt ein Bild anhängen möchten, klicken Sie auf Kontext hinzufügen > Medien
und laden Sie das Bild hoch.
Hier sind nur einige Beispiele dafür, wie der KI-Agent Sie bei der Arbeit mit Bildern unterstützen kann:
Wenn Sie ein Mock-up der gewünschten Benutzeroberfläche haben, kann der Agent den Code bereitstellen, mit dem sie erstellt wird. Wenn Sie dem Agenten beispielsweise einen Screenshot der App Now in Android zur Verfügung stellen, kann er den Compose-Code zum Erstellen der App bereitstellen. In diesem Beispiel sehen Sie einen Screenshot des App-Feeds (links) und den vom KI-Agenten generierten Jetpack Compose-Code (rechts) für diese Benutzeroberfläche. Weitere Informationen finden Sie unter UI mit Bildanhängen generieren.
Der KI-Agent generiert Jetpack Compose-Code aus einem UI-Screenshot der Now in Android-App. Wenn Sie wissen möchten, wie eine App aufgebaut ist, kann der Agent erklären, wie die Benutzeroberfläche in Bezug auf ihre Komponenten funktioniert. Sie können den KI-Agenten beispielsweise bitten, die Composables und den Datenfluss hinter einem anderen Screenshot von „Now in Android“ zu erklären. Das linke Bild zeigt einen Detailbildschirm mit einer Nachricht und das rechte Bild die Erklärung des KI-Agenten zur Compose-Struktur und zum Datenfluss für diesen Bildschirm.
Der KI-Agent erklärt die UI-Komposition und den Datenfluss eines bestimmten App-Bildschirms. Wenn Sie ein Architekturdiagramm für eine Anwendung haben, kann der KI-Agent Code vorschlagen, um die Anwendung basierend auf dem Diagramm zu erstellen. Er fungiert also als Full-Stack-Entwicklungsassistent. Der Agent kann auch beim Dokumentieren des Diagramms und beim Erklären der Konstruktion der Anwendung helfen. Das ist nützlich, wenn Sie ein Designdokument schreiben, das Ihre Teammitglieder prüfen sollen. Die folgende Abbildung zeigt beispielsweise ein vereinfachtes Architekturdiagramm, das den Datenfluss zwischen verschiedenen App-Komponenten wie UI, ViewModel, Repository und Datenquelle darstellt.
Der KI-Agent kann Code und Dokumentation aus einem Architekturdiagramm einer Anwendung generieren. Wenn Sie einen Fehler in der Benutzeroberfläche bemerken, machen Sie einen Screenshot und bitten Sie den Agenten, Lösungen zu finden. Sie können den Fehler markieren, indem Sie den Bereich mit dem Fehler einkreisen. Das folgende Beispiel zeigt einen Screenshot einer mobilen App mit einem roten Kreis, der ein falsch ausgerichtetes UI-Element hervorhebt.
Der KI-Agent kann anhand eines Screenshots Lösungen für UI-Fehler vorschlagen.