変換 UI

Gemini を使用すると、Compose プレビュー環境内で UI コードを変換できます。プレビューで自然言語を直接使用します。

Gemini を使用して UI を変換する手順は次のとおりです。

  1. Compose プレビュー パネルで、プレビューを右クリックして [Gemini で UI を変換] を選択します。

    コンテキスト メニューの [Transform UI with Gemini]
    [Gemini を使用して変換] メニューにアクセスする

  2. 「これらのボタンを中央揃えにする」などの自然言語のリクエストを入力して、Gemini にレイアウトやスタイルの調整を指示します。また、プレビューで特定の UI 要素を選択して、コンテキストをより明確にすることもできます。

    [Gemini で UI を変換] モーダル ダイアログ
    Compose プレビューに自然言語変換を適用する

  3. Gemini は、コード編集の候補を含む差分を生成します。変更を承認する前に、必要に応じて更新内容を確認してさらに調整できます。

次のようなプロンプトを試してみましょう。

  • 「テキストの行間を広げて」
  • 「アイコンを 10% 大きくして」
  • 「背景色を <色> に変更して」