Personalizzare l'app di riferimento

Questa sezione descrive in dettaglio come personalizzare l'app di riferimento Control Center e la relativa UI.

Flussi utente e interfaccia utente

Questa sezione descrive i flussi utente e come avviare Control Center.

Avviare il Centro di controllo

Puoi avviare il Centro di controllo tramite Avvio app o un'icona sulla barra di navigazione dell'UI di sistema. L'icona viene visualizzata solo nelle build in cui sono stati attivati gli utenti visibili in background (per saperne di più, vedi UserHandleAware).

Puoi visualizzare il Centro di controllo in qualsiasi momento. Il Centro di controllo è costituito da una combinazione di finestre traslucide e sfondi trasparenti, in modo che possa apparire sopra qualsiasi altra app, inclusi video e contenuti multimediali in riproduzione attiva. Nella pagina di destinazione dell'app:

  • La disposizione dello schermo e l'utilizzo degli schermi locale e remoto.
  • Le schermate popolate con contenuti multimediali e controlli multimediali.
  • Come ogni schermata introduce una visualizzazione dettagliata dei controlli multimediali (e altro ancora).

La disposizione degli schermi rappresenta il layout degli schermi nel veicolo. Ogni schermata è un DevicePickerScreen. Per personalizzare la posizione e le dimensioni di ogni schermo, utilizza una risorsa di overlay in fase di runtime (RRO). Per saperne di più, consulta Modificare il valore delle risorse di un'app in fase di runtime.

Per ogni display su cui è aperto il Centro di controllo, viene visualizzata una schermata diversa con un bordo evidenziato luminoso. Questa è la schermata locale, il display in uso.

Ogni altro schermo è uno schermo remoto per rappresentare un display diverso nell'auto che puoi identificare in base alla disposizione degli schermi nel frammento. Per calcolare il numero totale di zone dell'abitacolo configurate nel veicolo, utilizza CarOccupantZoneManager#getAllOccupantZones.

Ogni schermata definisce un attributo personalizzato controlcenter:occupantZoneId per associare i dati alla rispettiva zona occupante. Quando un'app multimediale viene riprodotta su un display specifico, la schermata corrispondente mostra la copertina dell'album. Sotto lo schermo viene visualizzato un pulsante Riproduci (o Pausa).

Se l'app multimediale attiva è un'attività visibile (aperta dietro il Centro di controllo), viene attivato un pulsante Condividi accanto al pulsante Riproduci per aprire la pagina di mirroring. Condividi ti consente di condividere la visualizzazione dell'app multimediale ed è più utile per le app multimediali con video.

Elementi dello schermo

Se tocchi una schermata, viene visualizzata una visualizzazione dettagliata dei contenuti multimediali riprodotti sul display. Questa schermata è chiamata Schermata dei dettagli. La visualizzazione mostra i metadati dei contenuti multimediali, come titolo, avanzamento della riproduzione e artista. Questi pulsanti forniscono un controllo aggiuntivo della zona occupante.

  • Uscita audio mostra l'uscita audio che riproduce i contenuti multimediali, ad esempio gli altoparlanti dell'abitacolo o le cuffie. Output audio apre una finestra di dialogo per modificare l'output audio e il volume dei contenuti multimediali.

  • Blocco input display blocca l'input sullo schermo. Questa operazione non può essere applicata allo schermo del conducente.

  • L'opzione Display Power (Alimentazione display) disattiva l'alimentazione dello schermo. Questa operazione non può essere applicata allo schermo del conducente.

La visualizzazione Dettagli mostra un pulsante Condividi da toccare quando il contenuto multimediale è un'attività visibile dietro l'app Centro di controllo. Condividi apre la pagina di mirroring:

Percorso di mirroring e visione condivisa tra il mittente (in alto) e il destinatario (in basso)
Figura 2. Pagina di mirroring e percorso di visione in coppia tra il mittente (in alto) e il destinatario (in basso).

Avviare una sessione di visione condivisa

La pagina di mirroring è simile alla pagina di destinazione in quanto utilizza un RRO.

Per aggiungere una schermata alla visione condivisa, toccala e poi tocca Fine.

In questo modo si apre un Mirroring Activity che ospita l'app condivisa e fornisce controlli temporanei e mobili per uscire dalla sessione di visione condivisa o rientrare nella pagina di mirroring per aggiungere o rimuovere partecipanti.

Attività di mirroring che mostra un'app condivisa con controlli mobili per gestire la sessione di visualizzazione condivisa.
Figura 3. Attività di mirroring con controlli mobili temporanei.

Riepilogo

Di seguito sono riepilogate le diverse pagine del Centro di controllo.

Diagramma di flusso che mostra le diverse pagine e transizioni all'interno dell'app Centro di controllo.
Figura 4. Pagine del Centro di controllo.

Linee guida per la personalizzazione

Il Centro di controllo utilizza la libreria dell'interfaccia utente dell'auto per consentirti di personalizzare e fornisce un tema e una struttura di base che possono essere adottati così come sono o modificati in base a queste limitazioni.

Personalizzazione Descrizione
SHOULD

Regola lo stile e il tema generale tramite un RRO, ad esempio:

  • Tavolozza dei colori
  • Taglie
  • Aspetto del testo
  • Aspetto della finestra di dialogo
  • Risorse disegnabili
  • Valori di configurazione
MAGGIO Modifica la struttura dell'interfaccia utente di alto livello del Centro di controllo.

Il Centro di controllo fa parte di una suite di app di sistema, che include Media, Centro notifiche e Avvio app. Queste app condividono stili e asset definiti in diversi livelli della struttura AOSP:

framework/base/core
Qui sono definiti tutti gli stili di base di Android. Nello specifico, tutti i temi delle app di sistema si basano su Theme.DeviceDefault, il tema progettato per essere utilizzato dagli OEM per personalizzare l'aspetto predefinito del dispositivo.

packages/services/Car/car_product/overlay:
Questa cartella contiene override di Theme.DeviceDefault utilizzati per produrre l'aspetto e l'esperienza utente AOSP di Android Automotive. Gli OEM potrebbero scegliere di escludere questa overlay e utilizzare la propria.

packages/apps/Car/libs/car-ui-lib:
Questa libreria definisce componenti e risorse AAOS comuni alle app di sistema e alle app non raggruppate progettate per la personalizzazione. Per informazioni dettagliate, consulta la guida all'integrazione della libreria UI auto.

packages/apps/Car/libs/car-apps-common:
Colori e stili comuni condivisi tra le app di sistema fornite da AOSP. Puoi utilizzare le sovrapposizioni per personalizzare questi elementi (in modo simile a packages/services/Car/car_product/overlay).

packages/apps/Car/MultiDisplay/ControlCenter:
Tutte le app di sistema hanno un tema che si estende da Theme.CarUi e sono definiti in car-ui-lib. ControlCenterActivity utilizza Theme.Transparent personalizzati, che estendono Theme.CarUi.

Per supportare un flusso (ad esempio la visione in gruppo che richiede la visibilità dell'attività duplicata), il Centro di controllo utilizza una combinazione di finestre traslucide e sfondi trasparenti che non inviano l'app in background o inviano Lifecycle events.

<style name="Theme.Transparent" parent="@style/Theme.CarUi.NoToolbar">
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:windowBackground">@color/transparent</item>
</style>