Kullanıcı arayüzü özelleştirmeleri

Media3, bazı özelleştirme seçenekleri sunan varsayılan bir PlayerView sağlar. Daha fazla özelleştirme için uygulama geliştiricilerin kendi kullanıcı arayüzü bileşenlerini uygulamaları gerekir.

En iyi uygulamalar

Media3 Player'e (ör. ExoPlayer, MediaController veya özel Player uygulaması) bağlanan bir medya kullanıcı arayüzü uygularken uygulamaların en iyi kullanıcı arayüzü deneyimi için aşağıdaki en iyi uygulamalara uyması önerilir.

Oynat/Duraklat düğmesi

Oynat ve duraklat düğmesi doğrudan tek oyunculu duruma karşılık gelmez. Örneğin, oynatma sona erdiğinde veya başarısız olduğunda kullanıcı, oynatıcı duraklatılmamış olsa bile oynatmayı yeniden başlatabilmelidir.

Uygulamayı basitleştirmek için Media3, hangi düğmenin gösterileceğine (Util.shouldShowPlayButton) ve düğme basma işlemlerini işlemeye (Util.handlePlayPauseButtonAction) karar vermek üzere yardımcı yöntemler sağlar:

Kotlin

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

Java

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

Durum güncellemelerini dinleme

Kullanıcı arayüzü bileşeninin, ilgili bir kullanıcı arayüzü güncellemesi gerektiren durum değişikliklerinden haberdar olması için bir Player.Listener eklemesi gerekir. Ayrıntılar için Oynatma etkinliklerini dinleme bölümüne bakın.

Kullanıcı arayüzünün yenilenmesi maliyetli olabilir ve birden fazla oyuncu etkinliği genellikle bir arada sunulur. Kullanıcı arayüzünü kısa süre içinde çok sık yenilemekten kaçınmak için genellikle yalnızca onEvents'ü dinlemek ve kullanıcı arayüzü güncellemelerini buradan tetiklemek daha iyidir:

Kotlin

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()
    }
  }
})

Java

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();
    }
  }
});

Kullanılabilir komutları işleme

Farklı Playeruygulamalarla çalışması gerekebilecek genel amaçlı bir kullanıcı arayüzü bileşeni, düğmeleri göstermek veya gizlemek ve desteklenmeyen yöntemleri çağırmamak için mevcut oynatıcı komutlarını kontrol etmelidir:

Kotlin

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

Java

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

İlk kare deklanşörü ve resim görüntüleme

Bir kullanıcı arayüzü bileşeni video veya resim gösterdiğinde, gerçek ilk kare veya resim mevcut olana kadar genellikle yer tutucu deklanşör görünümü kullanır. Ayrıca, video ve resimlerin birlikte oynatılması için resim görünümünün uygun zamanlarda gizlenmesi ve gösterilmesi gerekir.

Bu güncellemeleri işlemek için yaygın bir yöntem, seçili parçalardaki değişiklikler (EVENT_TRACKS_CHANGED) ve ilk video karesi oluşturulduğunda (EVENT_RENDERED_FIRST_FRAME) Player.Listener.onEvents, yeni bir resim kullanıldığında ise ImageOutput.onImageAvailable değişkenini dinlemektir:

Kotlin

override fun onEvents(player: Player, events: Player.Events) {
  if (events.contains(Player.EVENT_TRACKS_CHANGED)) {
    // If no video or image track: show shutter, hide image view.
    // Otherwise: do nothing to wait for first frame or image.
  }
  if (events.contains(Player.EVENT_RENDERED_FIRST_FRAME)) {
    // Hide shutter, hide image view.
  }
}

override fun onImageAvailable(presentationTimeUs: Long, bitmap: Bitmap) {
  // Show shutter, set image and show image view.
}

Java

@Override
public void onEvents(Player player, Events events) {
  if (events.contains(Player.EVENT_TRACKS_CHANGED)) {
    // If no video or image track: show shutter, hide image view.
    // Otherwise: do nothing to wait for first frame or image.
  }
  if (events.contains(Player.EVENT_RENDERED_FIRST_FRAME)) {
    // Hide shutter, hide image view.
  }
}

@Override
public void onImageAvailable(long presentationTimeUs, Bitmap bitmap) {
  // Show shutter, set image and show image view.
}