Android Studio の新しい UI

Android Studio Ladybug の機能ドロップでは、IntelliJ Platform 2024.2 アップデートの新しいデフォルト UI が導入されています。新しい UI では、デザインが合理化され、機能が強化されているため、新規デベロッパーと経験豊富なデベロッパーの両方がワークフローをより効率的に操作できます。

主な設計変更

新しい UI には、ワークフローを強化し、より一貫性のある環境を提供するための多くの改善点が盛り込まれています。視覚的な複雑さを軽減し、重要な機能に簡単にアクセスできるようにし、必要に応じて高度な機能を段階的に開示することにより、クリーンなデザインを実現することを目的としています。以降のセクションでは、新しい UI で発生する主な変更点について説明します。

テーマとアイコン

ライトモードとダークモードが更新され、色のコントラストが改善され、デザインの統一性が高まり、視覚的に魅力的なエクスペリエンスが実現しました。好みに合わせてテーマを簡単に切り替えられるようになりました。

図 1. 新しい UI のライトモード。
図 2. 新しい UI のライトモード（ライトヘッダー付き）テーマ。
図 3. 新しい UI のダークモード。

新しい UI には、よりシンプルで読みやすく、区別しやすいモダンなアイコンセットも用意されています。これにより、IDE 全体で視覚的に一貫したエクスペリエンスを提供できます。

図 4. 新しい UI のアイコンセット。

シンプルになったメイン ツールバー

新しい UI では、実行中のデバイスの選択、バージョン管理の管理、プロジェクトの切り替えなど、最も使用頻度の高いアクションを優先して表示する、すっきりとしたメイン ツールバーが採用されています。これにより、ツールの検索に費やす時間を減らし、コーディングに多くの時間を割くことができます。

図 5. 従来の UI
図 6. シンプルになったメイン ツールバーを備えた新しい UI。

[設定] > [Appearance & Behavior] > [Menus and Toolbars] で、メインツールバーに必要なアクションを追加してカスタマイズします。

図 7. メイン ツールバーをカスタマイズするための設定。

Git とプロジェクトのウィジェット

メイン ツールバーに、次の 2 つの新しいメニュー ウィジェットが追加されました。

  • 最近のプロジェクトを閲覧したり、新しいプロジェクトを作成したりするためのプロジェクト ウィジェット。
図 8. メイン ツールバーのプロジェクト ウィジェットの場所。
  • バージョン管理と一般的な Git アクション用の Git ウィジェット。Git ウィジェットはステータスバーの上部に移動されていますが、右下の以前の場所に戻すこともできます。
図 9. メイン ツールバーの Git ウィジェットの場所。

実行構成とプロファイリング アクション

実行構成とプロファイリング アクションが新しい実行ウィジェットに統合され、プロファイリング アクションはオーバーフロー メニューに移動されました。

図 10. Classic UI で構成を実行します。
図 11. Classic UI でのプロファイリング アクション。
図 12. 新しい UI での実行ウィジェットの場所。

ツール ウィンドウのデザイン変更

ツール ウィンドウが整理され、メイン ウィンドウの側面にドッキングされるようになりました。ツールウィンドウ バーが合理化され、選択したツールウィンドウ アイコンのみが表示されるようになりました。残りのアイコンには、オーバーフロー メニューからアクセスできます。この新しいツール ウィンドウのレイアウトはより直感的で、ワークスペースを柔軟にカスタマイズできます。

非表示のツール ウィンドウには、[その他のツール ウィンドウ] ボタンを使用してアクセスできます。選択すると、ツール ウィンドウが開き、そのボタンがデフォルトのツールバーに表示されます。

図 13. 新しい UI でのツール ウィンドウ オーバーフロー メニューの場所。

垂直分割と水平分割

ツールウィンドウ アイコンをドラッグしてワークスペースを分割します。垂直方向に分割する場合はサイドバーの分割線の下に、水平方向に分割する場合は反対側のサイドバーにドロップします。

図 14. 垂直分割。
図 15. 水平分割。

UI ツール コントロールの新しい場所

Compose とビューベースの両方のプレビューの UI ツール コントロール（Code、Split、Design）がエディタタブの外部に移動され、アクセスが容易になりました。

図 16. 従来の UI の UI ツール コントロール
図 17. 新しい UI の UI ツール コントロール

ナビゲーション バーには、選択したファイルのフルパスが表示されます。メインメニューで [View] > [Appearance] > [Navigation Bar] に移動すると、ナビゲーション バーをウィンドウの上部に移動できます。

図 18. 新しい UI のナビゲーション バー。

コンパクト モード

小さい画面向けに設計されたこのモードでは、IDE がよりコンパクトになります。ツールバーとヘッダーが短く、アイコンとボタンが小さく、要素間のスペースが狭くなります。

図 19. コンパクト モード（左）とデフォルト モード（右）の並べ替えビュー。
図 20. コンパクト モード（上）とデフォルト モード（下）のツールバーの高さの比較。

コンパクト モードは、次のいずれかの方法で有効にできます。

  • [表示] > [外観] > [コンパクト モード] に移動します。
  • IDE 設定を開き、[Appearance and Behavior] > [Appearance] を選択して、[Compact mode] オプションを有効にします。

従来の UI の継続的なサポート

従来の UI を好むデベロッパーは、JetBrains Marketplace で入手できるプラグインを使用してアクセスできます。IntelliJ では、すべてのデベロッパーがスムーズに移行できるように、クラシック UI プラグインは少なくとも 1 年間サポートされます。

詳しくは、JetBrains によるお知らせのブログ投稿をご覧ください。