スケーラブルな UI の概要

スケーラブル UI を使用して、自動車内で洗練された動的なマルチパネルのユーザー エクスペリエンスを構築します。スケーラブルな UI:

  • 柔軟なウィンドウ システムを提供します。

  • ユーザー インターフェース実装の互換性テストスイート（CTS）によって生じるエンジニアリング リスク、コスト、複雑さを最小限に抑えます。

スケーラブル UI は、動的なウィンドウ配置を必要とする幅広い最新の車載インフォテインメント（IVI）設計をサポートするとともに、静的なウィンドウ配置による従来の操作感もサポートするようスケールダウンします。

Android 17 では、高度なウィンドウ処理に固有の次の機能が導入されています。

サンプル エクスペリエンス

スケーラブル UI により、無限のウィンドウ処理構成が可能になります。スケーラブル UI をテストするために作成されたシナリオの例をいくつか紹介します。

フローティング アプリが表示された地図の背景

地図の背景構成の上に他のアプリケーションがフローティング表示されている様子。

アプリのバックグラウンド

フローティング パネルを含むアプリの背景構成。

他のアプリの下に固定されたアプリ

他のアプリが最前面で起動している、ウィジェット コンテナなどの固定されたアプリ。

条件付きフローティング パネル

メディアの再生中やアラートのトリガー時など、特定の条件が満たされた場合にのみ表示される条件付きフローティング パネル。

運転席側に固定されたアプリ

運転席側に配置された固定アプリ。

分割画面のレイアウト

2 つのアプリが左右に並んで表示されている分割画面レイアウト。

インタラクティブ分割画面

動的なサイズ変更が可能なインタラクティブな分割画面レイアウト。

大画面向けのマルチアンカー レイアウト

大画面向けに設計されたマルチアンカー レイアウト。

アプリのカルーセルが表示されたホーム画面のレイアウト。

特典とコンプライアンス

スケーラブル UI のメリットは次のとおりです。

  • テストリスクの低減: フレームワークは事前に認証されており、CTS に準拠しているため、プログラム サイクルの後半でテストが失敗する主なリスクを排除できます。スケーラブルな UI により、エンジニアリングの労力を数か月分削減し、コンプライアンスを加速できます。

  • 設計の柔軟性の向上: 複雑な既存の自動車用ウィンドウ モデルを多数再現できることが実証されています。スケーラブルな UI は、野心的で差別化されたデザインをサポートします。

  • 実装の複雑さを軽減: 高レベルの構成駆動型 XML モデルに抽象化することで、カスタム ウィンドウ処理ロジックの導入のハードルが下がります。

  • パフォーマンスの向上: スケーラブル UI は、標準の Android と完全に統合された高性能のウィンドウ基盤上で動作します。スムーズに移行し、直接最適化できます。

主要な構成要素

スケーラブルな UI により、OEM 固有のコードの必要性が最小限に抑えられ、更新が容易になり、落とし穴の排除や認証の問題の削減により、リリース リスクが軽減されます。

XML 駆動型のアプローチは、正確な位置決め、Z オーダーの競合、アプリのフォーカスなど、AAOS で複雑なウィンドウ システムを管理する際の一般的な課題に対処します。

スケーラブル UI は、これらのコア構成要素を提供します。

パネル

パネルは、画面上の基本的な長方形のコンテナです。各パネルは、独立した管理のための専用のルートタスクにマッピングされます。パネルは、アプリタスク（TaskPanel）や、ウィジェット（DecorPanel）などのビューベースのコンテンツをホストできます。詳しくは、パネルを構成するをご覧ください。

パターン

バリアントは、パネルの特定の視覚的状態を定義し、bounds（位置とサイズ）、visibility、layer（Z オーダー）、corner 半径などのプロパティを含みます。1 つのパネルに opened、closed、minimized などのバリエーションを設定できます。詳しくは、バリエーションを使用してビジュアル状態を設計するをご覧ください。

移行

トランジションは、パネルが現在の状態 fromVariant から新しい状態 toVariant にどのように移動するかを定義します。Event は遷移をトリガーします。遷移は、状態の変更時にパネルが使用するアニメーションを定義します。パネルが現在の状態から toVariant に移動します。同期の場合、コア ウィンドウ マネージャーがすべてのアニメーションとトランジションを調整します。

  • イベント: UI の変更を開始するトリガー。OEM またはシステムはトリガーを事前定義できます。たとえば、_System_OnHomeEvent、_System_TaskOpenEvent、カスタム ナビゲーション ボタンの押下などです。

たとえば、スケーラブル UI はイベントを使用してトランジションをトリガーします。これらのトランジションは、パネルを 1 つのバリエーションから別のバリエーションにアニメーション表示し、UI の動的な変化を表示します。スケーラブル UI は、これらの変更を他のシステムアプリに伝達し、必要に応じてコンテンツを調整します。XML で UI の関係を定義すると、次のことが可能になります。

  • 複雑な UI の動作を指定する: 複雑なユーザー インターフェースのインタラクションを定義します。

  • ウィンドウ環境を配置: ウィンドウの位置とレイヤリングを制御します。

  • ビジュアル テーマを実装する: 一貫したブランディングと美学を適用します。

  • コードの複雑さを軽減する: 大規模なカスタムコード開発の必要性を最小限に抑えます。

詳細については、トランジションを構成するをご覧ください。

システム UI ボタン

CarSystemBarButtons は、インテントをトリガーするだけでなく、event、selectedEvent、unselectedEvent 属性を使用してタップされたときにスケーラブル UI イベントをトリガーすることもできます。

event は、ボタンがタップされたときにトリガーされるイベントを記述します。イベントをより細かく制御する必要がある場合は、selectedEvent 属性と unselectedEvent 属性を使用して、ボタンが選択されたときと選択解除されたときにそれぞれトリガーするイベントを指定します。

システム UI を実装するタイミング

このセクションでは、スケーラブル UI の最適な使用方法について説明します。

永続的なマルチパネル レイアウトを作成する

画面のさまざまな領域が特定の機能に永続的に割り当てられるマルチゾーン エクスペリエンスを作成します。たとえば、専用のメディア コントロール、エアコンの操作バー、全画面マップなどです。

TaskPanels はプライマリ アプリ（ナビゲーションなど）に使用し、DecorPanels は TaskPanels の間に配置する必要があるビュー形式の UI 要素に使用します。

動的なホームシーンを実装する

複数のアプリパネルで構成され、同時に表示され、操作可能な Home シーンを実装します。たとえば、地図、メディア プレーヤー、アプリ グリッドなどです。

関連するすべてのパネルを opened または default のホーム バリエーションに移行するには、_System_HomeEvent を設定します。

コンテキスト オーバーレイを適用する

アプリのタスクと連携してアニメーション化できるコンテキスト ウィジェット、カスタム ブランディング、ドラッグバーなどのアプリ以外の UI 要素を配置します。

純粋に装飾的な要素やウィジェットをホストする要素には、DecorPanels を使用します。ウィジェットが完全に機能する起動可能なアプリをホストしている場合は、Panel > TaskPanel が最適です。レイヤリングを TaskPanel レイヤリングと同期させる必要がある場合は、View ベースの UI 要素に DecorPanels を使用します。

複雑なパネル インタラクションを設計する

アプリパネルの動的なサイズ変更や、メイン ディスプレイのコンテンツに基づくメーター クラスタ ビューの調整など、高度なユーザー主導のアクションを設計します。

カスタム Events を定義して、特定のシステム標準以外の Transitions をトリガーします。

IVI レイアウトを統合デジタル コックピットに拡張

スケーラブル UI は、SDV IVI VM のメイン インフォテインメント ディスプレイ（display0）でマルチパネル ウィンドウ（TaskPanel と DecorPanel）を管理します。スケーラブル UI をディスプレイの安全性とペア設定して、メイン ディスプレイのレイアウトが変更されたときにインストルメント クラスタのビューを更新できます。

  • スケーラブル UI アクション（SDV IVI VM）: メイン ディスプレイでパネルの状態が変化すると、スケーラブル UI は xml/scalable_ui_actions.xml の <Action> を使用してインテントを送信し、レイアウトまたはモードの変更をクラスタ コンポーネントに通知できます。詳細については、アクションを構成するをご覧ください。
  • DriverUI（SDV IVI VM）: ClusterHomeManager によって起動され、automotive-design-compose で構築されたシステムアプリとして、クラスタ ディスプレイ（display1）で実行されます。DriverUI は、安全に関係のないクラスタ コンテンツ（地図、メディア、電話など）をレンダリングし、IVI システムからの状態更新を処理します。
  • IVI の SDV Gateway（SDV IVI VM）: DriverUI は SDV Gateway Client を使用して、gRPC（driverui.proto）経由で高可用性レンダラ（HAR）に接続します。DriverUI は、クラスタ状態の更新（レイアウト バリアント、テーマ トークン、ロケールの変更など）を定期的なハートビート メッセージとともに送信します。
  • HAR と安全モニター（SDV Media VM）: 別の SDV Media VM で実行して、安全上重要な要素（速度、ギア、警告灯、チャイム、バックカメラのフィードなど）をレンダリングします。DriverUI からのハートビートを受信している間、HAR は Android クラスタ リージョンを透過的に保ち、DriverUI のコンテンツが HAR の安全オーバーレイとブレンドされるようにします。SDV IVI が起動中または使用できない場合、HAR はフォールバック プレースホルダを表示します。
  • OEM 構成: このフローを設定するには、SDV IVI の xml/scalable_ui_actions.xml で <Event> トリガーと <Action> インテントを構成し、セーフティ設計ツールチェーンの Figma デザイン ファイルと Config.json シグナル マッピングを更新し、ターゲット ハードウェア用の HAR プラットフォーム抽象化レイヤ（PAL）を実装します。