Personnalisation à double volet

Android 12 introduit une conception à double volet , avec un menu L0 statique à gauche et un volet de contenu à droite. Cette fonctionnalité introduit de nombreuses nouvelles options de personnalisation. Cette page 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 a une largeur supérieure ou égale à 1 400 dp et la vue à volet unique dans le cas contraire. Pour personnaliser cela pour un appareil spécifique, utilisez une superposition de ressources d'exécution (RRO) pour cibler les valeurs de configuration nécessaires :

Valeur Description
config_global_force_single_pane Définissez sur true si l’ensemble 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 double volet, ceci est utilisé pour le fragment initial dans le volet de contenu. Dans un volet unique, il devrait 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 touches d'en-tête est fourni pour simplifier les personnalisations. Dans AndroidManifest.xml , chaque activité prenant 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 telle sorte qu'un fragment particulier relève d'une préférence de niveau supérieur différente, le(s) mappage(s) pertinent(s) dans le fichier header_keys.xml peuvent être mis à jour pour spécifier la valeur correcte. .

Personnaliser la présentation des activités

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

Valeur 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 du 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) est enroulée autour de cette vue.
settings_focus_parking_view Implémentation personnalisée de FocusParkingView pour maintenir la mise au point rotative 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

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 manières différentes de personnaliser l’apparence de ces préférences :

Valeur Description
res/layout/top_level_preference.xml Superposez toute la disposition des préférences.
top_level_preference_min_height Hauteur minimale de la préférence de niveau supérieur. En fonction du 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 du coin.
top_level_preference_background Contexte des préférences de niveau supérieur lorsqu'elles ne sont pas actuellement mises en surbrillance.
top_level_preference_highlight Contexte des préférences de niveau supérieur lorsqu'elles sont mises en surbrillance.

Icônes de niveau supérieur

La figure 2 illustre comment les icônes de niveau supérieur sont désormais constituées d'une icône vectorielle à l'intérieur d'une forme d'arrière-plan colorée. Cette forme est actuellement configurée pour prendre en charge 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 insérant 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 ont la même valeur et 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étadonnées de l'application d'injection.
  2. com.android.settings.bg.hint Métadonnées de l'application d'injection.
  3. top_level_injected_default_background Spécifié dans res/values/colors.xml .

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