Personnalisations de l'UI

Media3 fournit un PlayerView par défaut qui fournit des options de personnalisation. Pour toute personnalisation plus poussée, les développeurs d'applications doivent implémenter leurs propres composants d'interface utilisateur.

Bonnes pratiques

Lorsque vous implémentez une UI multimédia qui se connecte à un Player Media3 (par exemple, ExoPlayer, MediaController ou une implémentation Player personnalisée), il est recommandé aux applications de suivre ces bonnes pratiques pour bénéficier d'une expérience optimale dans l'interface utilisateur.

Bouton Lecture/Pause

Le bouton lecture/pause ne correspond pas directement à un état de lecteur individuel. Par exemple, un utilisateur doit pouvoir redémarrer la lecture après l'arrêt ou l'échec, même si le lecteur n'est pas mis en pause.

Pour simplifier l'implémentation, Media3 fournit des méthodes utilitaires permettant de choisir le bouton à afficher (Util.shouldShowPlayButton) et de gérer les appuis sur le bouton (Util.handlePlayPauseButtonAction):

val shouldShowPlayButton: Boolean = Util.shouldShowPlayButton(player)
playPauseButton.setImageDrawable(if (shouldShowPlayButton) playDrawable else pauseDrawable)
playPauseButton.setOnClickListener { Util.handlePlayPauseButtonAction(player) }

boolean shouldShowPlayButton = Util.shouldShowPlayButton(player);
playPauseButton.setImageDrawable(shouldShowPlayButton ? playDrawable : pauseDrawable);
playPauseButton.setOnClickListener(view -> Util.handlePlayPauseButtonAction(player));

Écouter les mises à jour d'état

Le composant d'interface utilisateur doit ajouter un Player.Listener pour être informé des changements d'état nécessitant une mise à jour de l'interface utilisateur correspondante. Pour en savoir plus, consultez Écouter les événements de lecture.

L'actualisation de l'interface utilisateur peut s'avérer coûteuse et plusieurs événements de joueur ont souvent lieu ensemble. Pour éviter d'actualiser l'interface utilisateur trop souvent en peu de temps, il est généralement préférable d'écouter uniquement onEvents et de déclencher les mises à jour de l'interface utilisateur à partir de là:

player.addListener(object : Player.Listener{
  override fun onEvents(player: Player, events: Player.Events){
    if (events.containsAny(
        Player.EVENT_PLAY_WHEN_READY_CHANGED,
        Player.EVENT_PLAYBACK_STATE_CHANGED,
        Player.EVENT_PLAYBACK_SUPPRESSION_REASON_CHANGED)) {
      updatePlayPauseButton()
    }
    if (events.containsAny(Player.EVENT_REPEAT_MODE_CHANGED)) {
      updateRepeatModeButton()
    }
  }
})

player.addListener(new Player.Listener() {
  @Override
  public void onEvents(Player player, Player.Events events) {
    if (events.containsAny(
        Player.EVENT_PLAY_WHEN_READY_CHANGED,
        Player.EVENT_PLAYBACK_STATE_CHANGED,
        Player.EVENT_PLAYBACK_SUPPRESSION_REASON_CHANGED)) {
      updatePlayPauseButton();
    }
    if (events.containsAny(Player.EVENT_REPEAT_MODE_CHANGED)) {
      updateRepeatModeButton();
    }
  }
});

Gérer les commandes disponibles

Un composant d'interface utilisateur à usage général qui peut avoir besoin de fonctionner avec différentes implémentations Player doit vérifier les commandes disponibles du lecteur pour afficher ou masquer les boutons et pour éviter d'appeler des méthodes non compatibles:

nextButton.isEnabled = player.isCommandAvailable(Player.COMMAND_SEEK_TO_NEXT)

nextButton.setEnabled(player.isCommandAvailable(Player.COMMAND_SEEK_TO_NEXT));