Configurare un pannello

Un pannello descrive le proprietà dell'area che occupa e funge da contenitore dell'app. Utilizzi le configurazioni XML per definire i pannelli, che forniscono un approccio flessibile e senza codice per personalizzare le UI. Per gestire le istanze e gli stati, il sistema tiene traccia dei pannelli definiti.

Elenco dei pannelli

L'interfaccia utente di sistema carica le definizioni dei suoi pannelli da una risorsa array denominata window_states. Questo array di risorse punta ai file XML in cui sono definite le singole configurazioni del pannello. Questo approccio centralizzato significa che i riquadri gestiti da Scalable UI vengono caricati come previsto e sono pronti per l'uso da parte del sistema.

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <array name="window_states">
       <item>@xml/app_panel</item>
       <item>@xml/back_panel</item>
       ...
   </array>
</resources>

Definizione del pannello

Ogni riquadro nel framework dell'interfaccia utente scalabile è definito con un tag XML denominato <TaskPanel>, che descrive le proprietà di un contenitore di app. L'interfaccia utente del sistema carica queste definizioni del pannello e tiene traccia dei pannelli finché non viene caricata un'altra configurazione.

Ad esempio, a causa di una modifica alla configurazione dovuta alla rotazione o a una richiesta esplicita del sistema. <TaskPanel> è un componente fondamentale per creare un'esperienza personalizzata tramite componenti UI configurabili.

Attributi XML

Il tag <TaskPanel> può contenere questi attributi che puoi utilizzare per definire stati e transizioni.

Attributo Stato Descrizione
id Obbligatorio Specifica un identificatore univoco per il riquadro. Questo attributo viene utilizzato per recuperare il pannello da PanelPool e per gestirne lo stato all'interno del sistema.
role Obbligatorio Definisce lo scopo o la funzione del pannello nel sistema. Il valore può fare riferimento a una risorsa stringa, a un array di stringhe di nomi di componenti o a un ID layout. Ad esempio, può definire attività persistenti che devono essere sempre visualizzate nel pannello o un layout da espandere.
defaultVariant Facoltativo Specifica l'ID della variante che il pannello deve adottare inizialmente al momento del caricamento. Se non specificato, il sistema può utilizzare la prima variante definita come predefinita.
displayId Facoltativo Specifica l'ID del display in cui deve essere visualizzato il pannello.
defaultLayer Facoltativo Può specificare un ordine Z predefinito per le varianti del pannello se le varianti non definiscono esplicitamente un livello.
controller Facoltativo,
soggetto a modifiche

Fa riferimento a una risorsa (di solito un ID XML) che definisce un controller specifico del pannello, che consente di archiviare e passare i valori di configurazione ai controller del pannello personalizzati.

Questi controller devono implementare l'interfaccia com.android.car.scalableui.panel.TaskPanelController. Un caso d'uso comune di questi controller è definire allocazioni flessibili delle attività di runtime nel pannello.

Elementi secondari XML

Il tag <TaskPanel> può includere questi attributi per definire le caratteristiche e i comportamenti predefiniti.

Attributo Descrizione
<Variant>

Il tag nidificato descrive una configurazione visiva specifica per il riquadro in un determinato momento. Un pannello può avere più varianti, ognuna identificata da un ID univoco.

Ogni variante definisce proprietà come limiti, visibilità, livello, alfa, raggio dell'angolo e margini interni per quella particolare configurazione. Le varianti possono anche ereditare le proprietà da una variante principale.
<KeyFrameVariant> L'estensione di <Variant> consente l'interpolazione delle proprietà visive tra le diverse varianti in base a un valore di frazione continuo (da 0 a 1) e viene utilizzata per transizioni fluide e dinamiche, ad esempio durante un'operazione di trascinamento, quando lo stato del pannello dipende da un input continuo come un importo di trascinamento.
<Transitions>

Il tag nidificato contiene una raccolta di definizioni <Transition> che descrivono come l'interfaccia utente deve animarsi tra le diverse varianti.

Ogni <Transition> definisce le varianti from e to, l'evento che lo attiva e può specificare facoltativamente un Animator personalizzato da utilizzare per l'animazione, nonché una durata e un interpolatore.

Codice di esempio

<Panel id="@+id/panelId"
        role="@array/roleValue"
        defaultVariant="@id/closed"
        displayId="0" >

 <Variant id="@+id/base">
        <Bounds left="0" top="0" width="100%" height="100%"/>
 </Variant>

<Variant id="@+id/opened" parent="@id/base">
    <Visibility isVisible="true"/>
</Variant>
<Variant id="@+id/closed"  parent="@id/base">
    <Visibility isVisible="false"/>
</Variant>

<Transitions>
    <Transition fromVariant="@id/closed"
                toVariant="@id/opened"
                onEvent="open_event"/>
        <Event id="_System_TaskOpenEvent" panelId="@id/panelId" />
    </Transition>
</Transitions>
</Panel>
Indietro
Implementare il windowing avanzato
Avanti
Configurare una variante