Configurer un panneau

Un panneau décrit les propriétés de la zone qu'il occupe et sert de conteneur d'application. Vous utilisez des configurations XML pour définir des panneaux, qui offrent une approche flexible et sans code pour personnaliser les UI. Pour gérer les instances et les états, le système suit les panneaux définis.

Liste des panneaux

L'UI système charge les définitions de ses panneaux à partir d'une ressource de tableau nommée window_states. Ce tableau de ressources pointe vers les fichiers XML dans lesquels sont définies les configurations de chaque panneau. Cette approche centralisée signifie que les panneaux gérés par l'UI évolutive sont chargés comme prévu et prêts à être utilisés par le système.

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

Définition du panneau

Chaque panneau du framework Scalable UI est défini avec un tag XML nommé <TaskPanel>, qui décrit les propriétés d'un conteneur d'application. L'UI système charge ces définitions de panneau et suit les panneaux jusqu'à ce qu'une autre configuration soit chargée.

Par exemple, par une modification de la configuration due à une rotation ou à une requête système explicite. <TaskPanel> sert de composant de base pour créer une expérience personnalisée à l'aide de composants d'interface utilisateur configurables.

Attributs XML

La balise <TaskPanel> peut contenir les attributs suivants, que vous pouvez utiliser pour définir des états et des transitions.

Attribut État Description
id Obligatoire Spécifie un identifiant unique pour le panneau. Cet attribut est utilisé pour récupérer le panneau à partir de PanelPool et gérer son état dans le système.
role Obligatoire Définit l'objectif ou la fonction du panneau dans le système. La valeur peut faire référence à une ressource de chaîne, à un tableau de chaînes de noms de composants ou à un ID de mise en page. Par exemple, il peut définir des activités persistantes qui doivent toujours être affichées sur le panneau ou une mise en page à développer.
defaultVariant Facultatif Spécifie l'ID de la variante que le panneau doit adopter initialement lors de son chargement. Si aucune n'est spécifiée, le système peut utiliser la première variante définie comme variante par défaut.
displayId Facultatif Spécifie l'ID de l'écran sur lequel le panneau doit s'afficher.
defaultLayer Facultatif Vous pouvez spécifier un ordre Z par défaut pour les variantes du panneau si elles ne définissent pas explicitement de calque.
controller Facultatif,
susceptible de changer

Fait référence à une ressource (généralement un ID XML) qui définit un contrôleur spécifique au panneau, ce qui permet de stocker et de transmettre des valeurs de configuration à des contrôleurs de panneau personnalisés.

Ces contrôleurs doivent implémenter l'interface com.android.car.scalableui.panel.TaskPanelController. Un cas d'utilisation courant de ces contrôleurs consiste à définir des allocations de tâches d'exécution flexibles sur le panneau.

Éléments enfants XML

La balise <TaskPanel> peut inclure les attributs suivants pour définir les caractéristiques et les comportements par défaut :

Attribut Description
<Variant>

Une balise imbriquée décrit une configuration visuelle spécifique pour le panneau à un moment donné. Un panneau peut comporter plusieurs variantes, chacune identifiée par un ID unique.

Chaque variante définit des propriétés telles que les limites, la visibilité, le calque, l'alpha, le rayon d'angle et les encarts pour cette configuration particulière. Les variantes peuvent également hériter des propriétés d'une variante parente.

<KeyFrameVariant> L'extension de <Variant> permet l'interpolation des propriétés visuelles entre différentes variantes en fonction d'une valeur de fraction continue (de 0 à 1) et est utilisée pour des transitions fluides et dynamiques, par exemple lors d'une opération de déplacement, lorsque l'état du panneau dépend d'une entrée continue telle qu'une quantité de déplacement.
<Transitions>

La balise imbriquée contient une collection de définitions <Transition>, qui décrivent comment l'UI doit animer les différentes variantes.

Chaque <Transition> définit les variantes from et to, l'événement qui le déclenche et peut éventuellement spécifier un Animator personnalisé à utiliser pour l'animation, ainsi qu'une durée et un interpolateur.

Exemple de code

<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>