仅使用 ExoPlayer 的控制器在没有黑色预览的情况下在 Android 中播放音频答案

【问题标题】：Use only ExoPlayer's controller for playing audio in Android without the black preview仅使用 ExoPlayer 的控制器在没有黑色预览的情况下在 Android 中播放音频
【发布时间】：2020-09-17 13:06:28
【问题描述】：

我想在 android 中播放音频文件列表。您可能知道，当您有视频文件时，使用com.google.android.exoplayer2.ui.PlayerView 确实有意义，因为您可以在屏幕上看到视频的内容，而底部有播放/暂停等控制器。但是对于音频文件，如果您让播放音频文件，则会出现黑屏。我需要的是只使用没有黑屏的控制器。

有没有办法做到这一点？

第一次编辑：在文档中，我遇到了PlaybackControlView 和PlayerControlView。我可以根据我的情况使用它们吗？如果是，使用哪一个？

第二次编辑：这是我研究 1 天后的结果。我在我的布局中使用了PlaybackControlView，如下所示：

<com.google.android.exoplayer2.ui.PlaybackControlView
      android:id="@+id/play_back_control_view"
      android:layout_width="0dp"        <--- I use ConstraintLayout, so this is okay
      android:layout_height="wrap_content"
      android:background="@color/black"
      android:alpha="0.15"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintBottom_toBottomOf="parent"
      app:controller_layout_id="@layout/custom_playback_control_view" />

正如您从上面的布局中看到的那样，我为此使用了一个名为 custom_playback_control_view.xml 的自定义布局。这是我的自定义布局内容：

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/black"
    xmlns:tools="http://schemas.android.com/tools">

    <ImageButton
        android:id="@id/exo_play"
        style="@style/ExoMediaButton.Play"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:ignore="ContentDescription"/>

    <ImageButton android:id="@id/exo_pause"
        style="@style/ExoMediaButton.Pause"

        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:ignore="ContentDescription"/>

    <View
        android:id="@id/exo_progress_placeholder"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="26dp"

        app:layout_constraintEnd_toStartOf="@id/exo_duration"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toEndOf="@id/exo_play"/>

    <TextView
        android:id="@id/exo_duration"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:includeFontPadding="false"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:textColor="#FFBEBEBE"
        android:textSize="14sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toEndOf="@id/exo_progress_placeholder"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

最后但同样重要的是，我在 Fragment 中将 ExoPlayer 附加到 PlaybackControlView 上：

myAudioPlayer = ExoPlayerFactory.newSimpleInstance(context)
binding.playBackControlView.player = myAudioPlayer

【问题讨论】：

你能详细说明一下屏幕截图吗？
你想达到什么目的？
我只想使用 ExoPlayer 的控制器视图来播放音频文件。就这样。只有底部的控制栏。
您需要实现自定义控制器并将播放器附加到您的自定义控制器。你能粘贴你当前的实现吗？
@crack_head：是的，当然。我将我的进度作为第二次编辑添加到上面的问题部分。

标签： android audio exoplayer

【解决方案1】：

尝试像这样创建一个自定义控制器并将其命名为 media_controller.xml。我在 laout 中使用了数据绑定

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

<FrameLayout
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#44000000"
    android:focusableInTouchMode="false">

    <RelativeLayout
        android:id="@+id/controller"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="10dp">


        <ImageView
            android:id="@+id/play"
            android:layout_width="64dp"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:adjustViewBounds="true"
            android:padding="2dp"
            android:src="@mipmap/ic_media_play" />

        <ImageView
            android:id="@+id/forward"
            android:layout_width="64dp"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toEndOf="@id/play"
            android:adjustViewBounds="true"
            android:clickable="true"
            android:focusable="true"
            android:padding="6dp"
            android:src="@mipmap/ic_media_forward" />

        <ImageView
            android:id="@+id/backward"
            android:layout_width="64dp"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toStartOf="@id/play"
            android:adjustViewBounds="true"
            android:clickable="true"
            android:focusable="true"
            android:padding="6dp"
            android:src="@mipmap/ic_media_backward" />


    </RelativeLayout>


</FrameLayout>
</layout>

接下来创建一个自定义类 ExpoMediaController.java，如下所示

public class ExpoMediaController extends FrameLayout implements View.OnClickListener, Player.EventListener{
 private LayoutInflater inflater;
 Player simpleExoPlayer;

 private MediaControllerBinding binding;//media_controller.xml

public ExpoMediaController(Context context, AttributeSet attrs) {
    super(context, attrs);
    inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    initView();
}


public ExpoMediaController(Context context) {
    super(context);
    inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    initView();
}


private void initView() {
    binding = DataBindingUtil.inflate(inflater, R.layout.media_controller, this, true);
    binding.play.setOnClickListener(this);
    binding.forward.setOnClickListener(this);
    binding.backward.setOnClickListener(this);


}

//Use this method to set and unset the player
public void setPlayer(@Nullable Player simpleExoPlayer) {
    if (this.simpleExoPlayer == simpleExoPlayer) {
        return;
    }
    Player oldPlayer = this.simpleExoPlayer;//get reference of old player which attached previously
    if (oldPlayer != null) {//if old player not null then clear it
        oldPlayer.removeListener(this);
    }
    this.simpleExoPlayer = simpleExoPlayer;
    if (this.simpleExoPlayer != null) {
        this.simpleExoPlayer.addListener(this);
    }
}

@Override
public void onPlayerStateChanged(boolean playWhenReady, int playbackState) {
    switch (playbackState) {
        case STATE_BUFFERING:
            break;
        case STATE_ENDED:
            break;
        case STATE_IDLE:
            break;
        case STATE_READY:
            if (playWhenReady) {
                binding.play.setImageResource(R.mipmap.ic_media_pause);
                binding.play.setVisibility(VISIBLE);

            } else {
                binding.play.setImageResource(R.mipmap.ic_media_play);
                binding.play.setVisibility(VISIBLE);
            }
            break;
        default:
            break;
    }
}

@Override
public void onClick(View v) {
    if (v == binding.play && simpleExoPlayer != null) {
        if (simpleExoPlayer.isPlaying()) {
            simpleExoPlayer.setPlayWhenReady(false);
            showControls();
        } else {
            if (simpleExoPlayer.getPlaybackState() == STATE_ENDED) {
                simpleExoPlayer.seekTo(0);
            }
            simpleExoPlayer.setPlayWhenReady(true);
        }
    }
}}

在您的活动布局中使用 ExpoMediaController 替换 com.google.android.exoplayer2.ui.PlaybackControlView。然后调用 ExpoMediaController 的 setPlayer 方法。现在您可以完全控制控制器视图了。

【讨论】：