Skalierbare Benutzeroberfläche – Übersicht

Mit Scalable UI können Sie anspruchsvolle, dynamische und mehrteilige Benutzeroberflächen für Autos erstellen. Skalierbare Benutzeroberfläche:

  • Bietet ein flexibles Fensterungssystem.

  • Minimiert die technischen Risiken, Kosten und Komplexitäten, die durch die Compatibility Test Suite (CTS) für Implementierungen der Benutzeroberfläche entstehen.

Die skalierbare Benutzeroberfläche unterstützt eine Vielzahl moderner IVI-Designs (In-Vehicle Infotainment), die dynamische Fensteranordnungen erfordern, und kann auch auf traditionelle Designs mit statischen Fensteranordnungen skaliert werden.

In Android 17 werden die folgenden Funktionen für die erweiterte Fensterverwaltung eingeführt:

Beispiele für Nutzungserlebnisse

Die skalierbare Benutzeroberfläche ermöglicht eine unendliche Vielfalt an Fensterkonfigurationen. Hier sind einige Beispielszenarien, die für die skalierbare Benutzeroberfläche erstellt wurden:

Kartenhintergrund mit schwebenden Apps

Eine Kartenhintergrundkonfiguration mit anderen Anwendungen, die darüber schweben.

App-Hintergrund

Eine Konfiguration für den Anwendungs-Hintergrund mit schwebenden Feldern.

Angepinnte App unter anderen Apps

Eine angepinnte Anwendung, z. B. ein Widget-Container, über der andere Anwendungen gestartet werden.

Bedingter unverankerter Bereich

Ein bedingtes schwebendes Feld, das nur angezeigt wird, wenn bestimmte Bedingungen erfüllt sind, z. B. wenn Medien wiedergegeben werden oder eine Benachrichtigung ausgelöst wird.

Angepinnte App in der Nähe des Fahrers

Eine angepinnte App, die sich näher am Fahrer befindet.

Splitscreen-Layout

Ein Splitscreen-Layout, in dem zwei Anwendungen nebeneinander angezeigt werden.

Interaktiver Splitscreen

Ein interaktives Splitscreen-Layout, das dynamische Größenanpassung ermöglicht.

Layout mit mehreren Ankern für große Bildschirme

Ein Layout mit mehreren Ankern, das für große Bildschirme entwickelt wurde.

Ein Startbildschirm-Layout mit einem App-Karussell.

Vorteile und Compliance

Vorteile der skalierbaren Benutzeroberfläche:

  • Geringeres Testrisiko: Das Framework ist vorzertifiziert und entspricht dem CTS. Dadurch wird das primäre Risiko von Testfehlern spät im Programmzyklus eliminiert. Mit einer skalierbaren Benutzeroberfläche können Sie monatelange Entwicklungsarbeit sparen und die Compliance beschleunigen.

  • Mehr Designflexibilität: Bewährte Fähigkeit, zahlreiche komplexe bestehende Modelle für Autofenster nachzubilden. Die skalierbare Benutzeroberfläche unterstützt anspruchsvolle und sehr differenzierte Designs.

  • Geringere Implementierungskomplexität: Durch die Abstraktion in ein XML-Modell auf hoher Ebene, das auf Konfigurationen basiert, wird die Einstiegshürde für benutzerdefinierte Fensterlogik gesenkt.

  • Bessere Leistung: Die skalierbare Benutzeroberfläche basiert auf einem leistungsstarken Windowing-System, das vollständig in Standard-Android integriert ist. Übergänge erfolgen reibungslos und ermöglichen eine direkte Optimierung.

Grundbausteine

Eine skalierbare Benutzeroberfläche minimiert den Bedarf an OEM-spezifischem Code, erleichtert die Aktualisierung und verringert das Risiko bei der Einführung, da Fallstricke vermieden und Zertifizierungsprobleme reduziert werden.

Der XML-basierte Ansatz löst häufige Probleme bei der Verwaltung komplexer Fensterungssysteme in AAOS, z. B. präzise Positionierung, Konflikte bei der Z-Reihenfolge und App-Fokus.

Scalable UI bietet diese grundlegenden Bausteine.

Feld

Ein Bereich ist der rechteckige Container auf dem Bildschirm. Jedes Feld entspricht einer dedizierten Stammaufgabe für die unabhängige Verwaltung. Ein Bereich kann App-Aufgaben (TaskPanel) oder ansichtsbasierte Inhalte wie Widgets (DecorPanel) enthalten. Weitere Informationen finden Sie unter Bereich konfigurieren.

Variante

Eine Variante definiert einen bestimmten visuellen Zustand für ein Feld und enthält Eigenschaften wie bounds (Position und Größe), visibility, layer (Z-Reihenfolge) und corner-Radius. Ein einzelnes Feld kann Varianten haben, z. B. opened, closed oder minimized. Weitere Informationen finden Sie unter Variante zum Entwerfen eines visuellen Status verwenden.

Übergang

Ein Übergang definiert, wie ein Bereich von seinem aktuellen Zustand fromVariant in einen neuen Zustand toVariant wechselt. Ein Event löst den Übergang aus, der die Animation definiert, die das Feld während der Zustandsänderung verwendet. Ein Bereich sollte von seinem aktuellen Status zu toVariant wechseln. Für die Synchronisierung animiert und koordiniert der Window Manager alle Übergänge.

  • Ereignis:Ein Trigger zum Initiieren einer Änderung der Benutzeroberfläche. Ein Erstausrüster oder das System kann einen Trigger vordefinieren. Beispiele: _System_OnHomeEvent, _System_TaskOpenEvent oder ein benutzerdefinierter Navigations-Button.

Bei Scalable UI werden beispielsweise Ereignisse verwendet, um Übergänge auszulösen. Bei diesen Übergängen wird ein Bereich von einer Variante in eine andere animiert, um dynamische Änderungen in der Benutzeroberfläche darzustellen. Die skalierbare Benutzeroberfläche teilt diese Änderungen anderen System-Apps mit, damit sie Inhalte nach Bedarf anpassen können. Wenn Sie UI-Beziehungen in XML definieren, haben Sie folgende Möglichkeiten:

  • Komplexe UI-Verhaltensweisen angeben:Definieren Sie komplexe Interaktionen der Benutzeroberfläche.

  • Fenstersysteme anordnen:Steuern Sie die Positionierung und das Layering von Fenstern.

  • Visuelle Themen implementieren:Sorgen Sie für ein einheitliches Branding und eine einheitliche Ästhetik.

  • Codekomplexität reduzieren:Der Bedarf an umfangreicher Entwicklung von benutzerdefiniertem Code wird minimiert.

Weitere Informationen finden Sie unter Übergang konfigurieren.

Schaltflächen der System-UI

Neben dem Auslösen von Intents kann CarSystemBarButtons auch ein Scalable UI-Ereignis auslösen, wenn es mit den Attributen event, selectedEvent und unselectedEvent angetippt wird.

event beschreibt das Ereignis, das ausgelöst werden soll, wenn auf den Button getippt wird. Wenn eine detailliertere Steuerung eines Ereignisses erforderlich ist, verwenden Sie die Attribute selectedEvent und unselectedEvent, um das Ereignis anzugeben, das ausgelöst werden soll, wenn die Schaltfläche ausgewählt bzw. die Auswahl aufgehoben wird.

Wann sollte die System-UI implementiert werden?

In diesem Abschnitt werden die optimalen Anwendungsfälle für die skalierbare Benutzeroberfläche beschrieben.

Dauerhafte Layouts mit mehreren Bereichen erstellen

Erstellen Sie eine Multizonen-Benutzeroberfläche, in der verschiedene Bereiche des Displays dauerhaft bestimmten Funktionen zugewiesen sind. Beispiele: spezielle Media-Steuerelemente, ein Klimastreifen oder eine Vollbildkarte.

Verwenden Sie TaskPanels für primäre Apps wie Navigations-Apps und DecorPanels für UI-Elemente in Form von Ansichten, die zwischen TaskPanels platziert werden müssen.

Dynamische Startszene implementieren

Implementieren Sie eine Home-Szene, die aus mehreren gleichzeitig sichtbaren und interaktiven App-Feldern besteht. Dazu gehören beispielsweise die Karte, der Mediaplayer und das App-Raster.

Wenn Sie alle relevanten Bereiche auf die opened- oder default-Varianten umstellen möchten, konfigurieren Sie _System_HomeEvent.

Kontextbezogene Overlays anwenden

Platzieren Sie UI-Elemente, die nicht zur App gehören, z. B. Kontext-Widgets, benutzerdefiniertes Branding und Ziehpunkte, die in Abstimmung mit App-Aufgaben animiert werden können.

Verwenden Sie DecorPanels für alle rein dekorativen Elemente oder Elemente, die Widgets hosten. Wenn ein Widget eine voll funktionsfähige, startbare App hostet, ist ein Panel > TaskPanel optimal. Verwenden Sie DecorPanels für ansichtsbasierte UI-Elemente, wenn die Ebenen mit den TaskPanel-Ebenen synchronisiert werden müssen.

Komplexe Bereichsinteraktionen entwerfen

Entwickeln Sie erweiterte nutzergesteuerte Aktionen, z. B. das dynamische Anpassen der Größe eines App-Bereichs oder das Anpassen der Ansichten des Kombiinstruments basierend auf den Inhalten des Hauptdisplays.

Definieren Sie benutzerdefinierte Events, um bestimmte, nicht systemstandardmäßige Transitions auszulösen.

IVI-Layouts auf ein Unified Digital Cockpit ausweiten

Die skalierbare Benutzeroberfläche verwaltet die Fensterdarstellung mit mehreren Feldern (TaskPanel und DecorPanel) auf dem Haupt-Infotainmentdisplay (display0) in der SDV IVI-VM. Sie können die skalierbare Benutzeroberfläche mit Display Safety kombinieren, um die Ansichten des Kombiinstruments zu aktualisieren, wenn sich das Layout des Hauptdisplays ändert:

  • Skalierbare UI-Aktionen (SDV IVI-VM): Wenn sich der Status eines Bereichs auf dem Hauptdisplay ändert, kann die skalierbare UI einen Intent mit einem <Action> in xml/scalable_ui_actions.xml senden, um Clusterkomponenten über Layout- oder Modusänderungen zu informieren. Weitere Informationen finden Sie unter Aktion konfigurieren.
  • DriverUI (SDV IVI VM): Wird auf dem Clusterdisplay (display1) als System-App ausgeführt, die von ClusterHomeManager gestartet und mit automotive-design-compose erstellt wurde. DriverUI rendert Inhalte, die nicht sicherheitsrelevant sind (z. B. Karten, Medien und Telefonanrufe), und verarbeitet Statusaktualisierungen vom IVI-System.
  • SDV-Gateway auf IVI (SDV IVI-VM): DriverUI verwendet die SDV Gateway Client, um über gRPC (driverui.proto) eine Verbindung zum HAR (High Availability Renderer) herzustellen. DriverUI sendet Clusterstatus-Updates (z. B. Layoutvarianten, Thementokens und Änderungen des Gebietsschemas) zusammen mit regelmäßigen Heartbeat-Nachrichten.
  • HAR und Safety Monitor (SDV Media VM): Werden in einer separaten SDV Media VM ausgeführt, um sicherheitskritische Elemente wie Geschwindigkeit, Gang, Kontrollleuchten, Warntöne und Rückfahrkamera-Feeds zu rendern. Während DriverUI Heartbeats von HAR empfängt, werden die Android-Clusterregionen von HAR transparent gehalten, damit die Inhalte von DriverUI mit den Sicherheitsoverlays von HAR verschmelzen. Wenn SDV IVI hochfährt oder nicht verfügbar ist, werden in HAR Fallback-Platzhalter angezeigt.
  • OEM-Konfiguration:Um diesen Ablauf einzurichten, konfigurieren Sie <Event>-Trigger und <Action>-Intents in xml/scalable_ui_actions.xml auf SDV IVI, aktualisieren Sie die Figma-Designdatei und die Config.json-Signalzuordnungen für die Toolchain für das Sicherheitsdesign und implementieren Sie die HAR Platform Abstraction Layer (PAL) für Ihre Zielhardware.