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 l'Avvio app o un'icona sulla barra di navigazione della 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. 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 dei contenuti 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 un overlay di risorse 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, ovvero 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 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 Guarda insieme o rientrare nella pagina Mirroring per aggiungere o rimuovere partecipanti.

L'attività di mirroring mostra un'app condivisa con controlli mobili per gestire la sessione di visualizzazione congiunta.
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 il tema e lo stile generali tramite un RRO, ad esempio:

  • Tavolozza dei colori
  • Taglie
  • Aspetto del testo
  • Aspetto della finestra di dialogo
  • Risorse disegnabili
  • Valori di configurazione
MAY 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 l'utilizzo da parte degli 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 di 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 maggiori dettagli, consulta la guida all'integrazione della libreria UI per 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 un elemento personalizzato Theme.Transparent, che estende Theme.CarUi.

Per supportare un flusso (ad esempio la visione condivisa 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 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>