Personnalisation du double volet

Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

Android 12 introduit une nouvelle conception à double volet , avec un menu L0 statique à gauche et un volet de contenu à droite. Cette fonctionnalité introduit de nombreuses nouvelles options de personnalisation. Cet article détaille ces fonctionnalités et explique comment vous pouvez personnaliser vos propres préférences.

Revenir au volet unique

Par défaut, CarSettings affiche désormais la vue à double volet lorsque la fenêtre de l'application est supérieure ou égale à 1400dp en largeur et la vue à volet unique dans le cas contraire. Pour personnaliser cela pour un périphérique spécifique, utilisez une superposition de ressources d'exécution (RRO) pour cibler les valeurs de configuration nécessaires :

Évaluer La description
config_global_force_single_pane Défini sur true si l'intégralité de l'application doit s'exécuter dans une configuration à volet unique.
config_homepage_fragment_class Spécifie le fragment de départ de la page d'accueil. Dans le volet double, ceci est utilisé pour le fragment initial dans le volet de contenu. Dans le volet unique, il doit s'agir du fragment de la page d'accueil.

Touches d'en-tête

Étant donné que différentes activités CarSettings peuvent avoir une IA personnalisée, un mappage de clé d'en-tête est fourni pour simplifier les personnalisations. Dans AndroidManifest.xml , chaque activité qui prend en charge le double volet a un TOP_LEVEL_HEADER_KEY spécifié dans ses métadonnées. Cette valeur pointe vers une clé spécifiée dans res/values/header_keys.xml , qui est mappée à la clé de préférence de l'élément de menu de niveau supérieur auquel appartient le fragment de départ. Par conséquent, si le fragment de départ d'une activité est modifié ou si l'IA est réorganisé de sorte qu'un fragment particulier relève d'une préférence de niveau supérieur différente, le ou les mappages pertinents dans le fichier header_keys.xml peuvent être mis à jour pour spécifier la valeur correcte. .

Personnaliser la mise en page de l'activité

La mise en page de BaseCarSettingsActivity se trouve dans res/layout/car_setting_activity et dans ces sections :

Évaluer La description
top_level_menu Fragment de menu de niveau supérieur affiché dans les configurations à double volet. La largeur de cette section est spécifiée par top_level_menu_width . Une disposition de base du châssis (avec barre d'outils) entoure cette vue.
top_level_divider Ligne verticale qui divise les deux volets et dont vous pouvez personnaliser la largeur avec top_level_divider_width .
fragment_container_wrapper Disposition wrapper pour le volet de contenu (ou le volet principal dans une configuration à volet unique). Une disposition de base du châssis (avec barre d'outils) entoure cette vue.
settings_focus_parking_view Implémentation personnalisée de FocusParkingView pour maintenir le focus rotatif en cas de besoin.
fragment_container Conteneur de contenu principal. Les fragments de contenu l'utilisent comme mise en page cible.
restricted_message Vue de blocage restreinte à l'UX à afficher sur les instances de BaseFragment .

Figure 1. Disposition à double volet

Préférences de niveau supérieur

Préférences

Les préférences de niveau supérieur sont des CarUiPreferences personnalisées avec une disposition légèrement modifiée pour modifier la hauteur des préférences et la forme de l'arrière-plan. Il existe de nombreuses façons de personnaliser l'apparence de ces préférences :

Évaluer La description
res/layout/top_level_preference.xml Superposez l' ensemble de la disposition des préférences.
top_level_preference_min_height Hauteur minimale de la préférence de niveau supérieur. Selon le contenu (par exemple, un sous-titre est présent), les préférences peuvent être supérieures à cette valeur.
top_level_preference_corner_radius Rayon de l'arrondi d'angle.
top_level_preference_background Arrière-plan des préférences de niveau supérieur lorsqu'elles ne sont pas actuellement en surbrillance.
top_level_preference_highlight Arrière-plan des préférences de niveau supérieur lorsqu'elles sont mises en surbrillance.

Icônes

La figure 2 illustre comment les icônes de niveau supérieur consistent désormais en une icône vectorielle à l'intérieur d'une forme d'arrière-plan colorée. Cette forme est actuellement configurée pour supporter une forme ovale ou rectangulaire. Par défaut, la forme est définie sur ovale.

Pour changer la valeur par défaut, modifiez la valeur dans config_top_level_icon_shape (où 0 est un rectangle et 1 est un ovale). Les icônes sont créées en incrustant l'icône de premier plan par top_level_foreground_icon_inset à partir de la forme d'arrière-plan. Chaque icône de niveau supérieur a une couleur de premier plan spécifiée dans res/values/colors.xml et une couleur d'arrière-plan spécifiée dans le dossier res/color .

Pour créer une apparence personnalisée, vous pouvez remplacer toutes les valeurs de couleur.

Figure 2. Composants de préférence de niveau supérieur

Les icônes des préférences injectées qui entrent dans les catégories spécifiées par config_top_level_injection_categories sont également traitées comme des icônes de niveau supérieur. Les icônes fournies sont insérées avec la même valeur et dans la même forme que celles spécifiées pour toutes les autres icônes de niveau supérieur (voir ci-dessus). Cependant, l'arrière-plan est déterminé en examinant les attributs suivants dans cet ordre :

  1. com.android.settings.bg.argb Méta-données de l'application d'injection.
  2. com.android.settings.bg.hint Méta-données de l'application d'injection.
  3. top_level_injected_default_background Spécifié dans res/values/colors.xml .

Pour ignorer les données d'application d'injection et toujours utiliser l'arrière-plan par défaut, définissez config_top_level_injection_background_always_use_default sur true .