Gemini in Android Studio のクエリに画像を添付すると、アプリのアーキテクチャをより深く理解し、UI 開発プロセスを加速できます。
プロンプトに画像を添付するには、[Attach Image File](画像ファイルを添付)
をクリックして画像をアップロードします。
Gemini を使って画像を操作する方法をいくつかご紹介します。
希望する UI のモックアップがある場合は、Gemini がその UI を作成するコードを提供します。たとえば、Gemini に Now in Android アプリのスクリーンショットを提供すると、そのアプリを作成するための Compose コードが提供されます。この例は、アプリのフィード(左)と、その UI 用に Gemini が生成した Jetpack Compose コード(右)のスクリーンショットを示しています。詳しくは、画像添付ファイルを使用して UI を生成するをご覧ください。
Gemini が Now in Android アプリの UI スクリーンショットから Jetpack Compose コードを生成する。 アプリの構成について知りたい場合は、Gemini に UI の仕組みをコンポーネント パーツの観点から説明してもらうことができます。たとえば、別の Now in Android のスクリーンショットの背後にあるコンポーザブルとデータフローを説明するよう Gemini にリクエストできます。左側の画像はニュース アイテムを含む詳細画面を示し、右側の画像は、その画面の Compose 構造とデータフローに関する Gemini の説明を示しています。
Gemini が特定のアプリ画面の UI 構成とデータフローを説明します。 アプリのアーキテクチャ図がある場合、Gemini はその図に基づいてアプリを作成するコードを提案し、フルスタック開発アシスタントとして機能します。Gemini は、図を文書化したり、アプリの構造を説明したりするのにも役立ちます。これは、チームメンバーがレビューする設計ドキュメントを作成する際に役立ちます。たとえば、次の図は、UI、ViewModel、リポジトリ、データソースなどのさまざまなアプリ コンポーネント間のデータフローを示す簡略化されたアーキテクチャ図です。
Gemini は、アプリのアーキテクチャ図からコードとドキュメントを生成できます。 UI のバグを見つけたら、スクリーンショットを撮って Gemini に解決策のブレインストーミングを依頼します。エラーのある部分を丸で囲むことで、問題点を指摘できます。次の例は、モバイルアプリのスクリーンショットを示しています。赤い円で、位置がずれている UI 要素がハイライト表示されています。
Gemini は、スクリーンショットから UI バグの解決策をブレインストーミングするのに役立ちます。