Personnalisation des médias

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

Media appartient à une suite d'applications système (par exemple, Dialer et App Launcher). Ces applications partagent des styles et des actifs communs définis à différents niveaux de la structure AOSP.

  • framework/base . Tous les styles de base Android sont définis ici.
  • packages/services/Car/car_product/overlay . Contient des superpositions au moment de la construction qui modifient les ressources de base/cadre standard pour produire l'aspect et la convivialité AOSP d'Android Automotive OS. Les OEM peuvent choisir d'exclure cette superposition et d'utiliser la leur.
  • packages/apps/Car/libs/car-ui-lib . Cette bibliothèque définit les composants et les ressources AAOS communs aux applications système et aux applications dégroupées conçues pour la personnalisation. Pour plus de détails, consultez le Guide d'intégration de la bibliothèque de l'interface utilisateur de la voiture .
  • packages/apps/Car/libs/car_app_common . Couleurs et styles communs partagés entre les applications du système automobile. Les OEM peuvent utiliser des superpositions pour personnaliser ces éléments (similaire à car_product/overlay décrit ci-dessus).
  • packages/apps/Car/libs/car_media_common . Contient des éléments partagés entre Media et d'autres interfaces utilisateur multimédia. Par exemple, le widget multimédia de l'écran d'accueil.
  • packages/apps/Car/Media. Toutes les applications système utilisent leur propre thème, qui s'étend de Theme.CarUi , tel que défini dans car-ui-lib .

Android Automotive AOSP fournit deux présentations de médias.

  • Interface utilisateur multimédia. Permet aux utilisateurs de se connecter, de parcourir le contenu et d'utiliser des commandes de lecture détaillées.
  • Widget multimédia de l'écran d'accueil. Active l'utilisation des principales fonctionnalités de contrôle de la lecture multimédia sur l'écran d'accueil.

Interface utilisateur multimédia

Cette figure décrit la structure de l'interface utilisateur multimédia :

Interface utilisateur multimédia

Figure 1. Interface utilisateur multimédia

Pour plus de détails sur les directives UX et UI ainsi que sur la structure spatiale des différents composants de Media, voir Modèle spatial .

AppBarView : barre d'outils

La barre d'outils de l'interface utilisateur multimédia est un composant partagé avec d'autres applications système, telles que Dialer et Radio. Pour savoir comment personnaliser la barre d'outils, consultez le Guide d'intégration de la bibliothèque de l'interface utilisateur de la voiture .

Taille maximale de l'illustration du média

Pour informer les applications multimédias de la taille maximale de l'illustration à récupérer, vous pouvez superposer media_items_bitmap_max_size_px dans votre système. Pour ce faire, envoyez EXTRA_MEDIA_ART_SIZE_HINT_PIXELS comme indice racine. En conséquence, vous économiserez de la bande passante lors du téléchargement d'images. Pour en savoir plus, consultez MediaConstants sur developer.android.com.

Parcourir le fragment

Browse se compose principalement d'un Car UI RecyclerView , qui gère la position de la barre de défilement, les flèches et les marges et peut parcourir des éléments de différents types, tels que des en-têtes, des éléments de grille, des éléments de grille d'icônes, des éléments de liste et des éléments de liste d'icônes.

Commandes de lecture réduites

Lorsque le fragment de navigation est affiché et lorsqu'un élément multimédia est sélectionné, une vue de commandes de lecture réduite s'affiche. La figure suivante illustre la structure de cette vue :

Commandes de lecture réduites

Figure 2. Commandes de lecture réduites

Parcourir la liste

Les développeurs peuvent utiliser un ensemble d' indications de style (voir Appliquer des styles de contenu ) pour personnaliser la présentation du contenu de navigation multimédia. Les équipementiers doivent adhérer à ces styles, en ajustant la présentation à leur système de conception.

Les types d'éléments pris en charge et les mises en page respectives sont situés comme suit :

  • LIST_ITEM ( media_browse_list_item.xml ). Couramment utilisé pour les épisodes d'un podcast, tels que les éléments de la liste de lecture et les favoris.
  • ICON_LIST_ITEM ( media_browse_list_icons_item.xml ). Utilisé pour les catégories ou les options de menu, dans lesquelles l'image incluse avec l'élément multimédia n'est pas une véritable pochette d'album mais une icône.
  • GRID_ITEM ( media_browse_grid_item.xml ). Couramment utilisé pour les éléments lisibles, comme les chansons ou les listes de lecture.
  • ICON_GRID_ITEM ( media_browse_grid_icons_item.xml ). Utilisé pour les catégories, similaire à ICON_LIST_ITEM .
  • EN- media_browse_header_item.xml HEADER . Utilisé pour organiser les éléments multimédias en sections.

Écran de lecture

Pour afficher cet écran, développez les commandes de lecture réduites :

  • Médias de l'élément multimédia en cours de lecture (y compris le titre et le sous-titre).
  • Commandes de lecture complètes.
  • File d'attente de lecture (utilisée pour afficher les éléments récemment lus ou les prochains éléments à lire).

Les composants de l'écran de lecture sont identifiés dans les figures ci-dessous.

Écran de lecture

Figure 3. Écran de lecture

L'écran de lecture ne partage pas la barre d'outils avec le reste de l'application. Au lieu de cela, les éléments en haut de l'écran sont gérés individuellement par cet écran.

Commandes de lecture

L'écran de lecture comprend un ensemble étendu de commandes de lecture, organisées en rangées de commandes . La ligne secondaire (affichée ci-dessous comme la ligne du haut) n'est affichée que si l'espace sur la première ligne n'est pas suffisant pour afficher toutes les actions renvoyées par l'application multimédia à partir de PlaybackStateCompat#getActions() .

Commandes de lecture

Figure 4. Commandes de lecture.

Les OEM peuvent personnaliser les icônes des actions standard, mais ils doivent présenter les icônes d'action personnalisées telles qu'elles sont fournies par les applications multimédias.

Widget multimédia de l'écran d'accueil

Ce widget est implémenté sous forme de fragment dans car-media-common . Ce fragment comprend une version réduite de l'écran de lecture décrit ci-dessus. Toutes les mêmes règles et capacités de personnalisation s'appliquent.

Widget multimédia de l'écran d'accueil

Figure 5. Widget multimédia de l'écran d'accueil

Le bouton App Selector affiché ci-dessus utilise la fonctionnalité de commutation décrite dans Media Source Switching User Flow .

Pour utiliser l'icône de source multimédia actuelle pour le bouton App Selector, superposez l'indicateur use_media_source_logo_for_app_selector défini dans platform/packages/apps/Car/libs/car-media-common/res/values/bools.xml et définissez-le sur true . Avec ce changement, l'icône Media Source sur le côté opposé de la barre d'outils de l'application sera masquée. La personnalisation s'applique également à l'application Media Center et à l'application Radio de référence.

Bouton de sélection d'application multimédia

Figure 6. Bouton de sélection d'application multimédia

Disposition des boutons Lecture, Pause et Arrêt

La disposition des boutons Lecture/Pause/Arrêt peut être personnalisée pour « Lecture en cours » et la vue réduite des commandes de lecture. Les deux dispositions sont définies dans packages/apps/Car/libs/car-media-common/res/layout/ .

Pour personnaliser la disposition des boutons, appliquez des superpositions au moment de la construction à play_pause_stop_button_layout.xml et minimized_play_pause_stop_button_layout.xml .

Mettez en surbrillance l'élément en cours dans la file d'attente de lecture

L'état de l'élément de file d'attente de lecture actuel est défini sur selected , il peut donc être personnalisé à l'aide de ressources d'état telles que des listes d'états de couleur (voir Ressource de liste d'état de couleur ) et des listes d'état drawables (voir Ressources drawable ). Pour appliquer les modifications de style nécessaires, vous pouvez remplacer la disposition des éléments de la file d'attente ( packages/apps/Car/Media/res/layout/queue_list_item.xml ).

Vous pouvez également afficher une icône à côté de l'élément de la file d'attente de lecture en cours :

Figure 7. Élément actuel en surbrillance dans la file d'attente de lecture