如何将Exoplayer的控件放置在PlayerView之外 [英] How to place the controls of an Exoplayer outside of the PlayerView

问题描述

我正在使用Exoplayer2在我的应用程序中显示视频.我需要控件始终可见.我可以通过设置 app:show_timeout ="0" 将其存档.但是，当控件始终可见时，它们会在PlayerView中占据空间.

I'm using Exoplayer2 to show videos in my application. I need the controls to be visible at all time. I can archive this by setting app:show_timeout="0". But when the controls are always visible they take up space in the PlayerView.

我想在PlayerView下显示控件，以便始终显示整个视频.

I would like to show the controls beneath the PlayerView, so that I can always show to whole video.

这是我的布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MediaPlayerActivity"
    android:theme="@android:style/Theme.NoTitleBar"
    android:contentDescription="hf_hide_help">

    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/playerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:use_controller="true"
        app:rewind_increment="0"
        app:fastforward_increment="0"
        app:repeat_toggle_modes="none"
        app:show_timeout="0"
        />
</RelativeLayout>

这是我的 exo_player_control_view.xml :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:layoutDirection="ltr"
    android:background="#CC000000"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:paddingTop="4dp"
        android:orientation="horizontal">

        <ImageButton android:id="@id/exo_play"
            style="@style/ExoMediaButton.Play"/>

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

        <TextView android:id="@id/exo_position"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="14sp"
            android:textStyle="bold"
            android:paddingLeft="4dp"
            android:paddingRight="4dp"
            android:includeFontPadding="false"
            android:textColor="#FFBEBEBE"/>

        <com.google.android.exoplayer2.ui.DefaultTimeBar
            android:id="@id/exo_progress"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="26dp"/>

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

    </LinearLayout>

</LinearLayout>

它是这样的:

这就是当我单击播放器时的样子-控件隐藏.

And this is what it looks like, when I click on the player - the controls hide.

推荐答案

您的用例不是一般情况，ExoPlayer不支持.对于您的情况，您将需要禁用默认控件，并在播放器视图下方添加自己的自定义控件.构建布局并将动作添加到其中非常容易.

Your use-case is not something general and ExoPlayer doesn't support it. In your case, you will need to disable the default controls and add your own custom controls beneath the player view. It would be very easy to build the layout and add the actions to them.

更新 :(要回答Gyan关于时间栏的评论)

Update: (To answer Gyan's comment about time-bar)

两种方法:(我解释了这些策略，因为在SO和其他站点上已经有成千上万的代码示例可用了)

Two approaches: (I explain the strategies since thousands of code examples are available already on SO and other sites)

1-我的建议非常适合我的需求:覆盖exoplayer的默认控件视图(在layouts文件夹中具有相同名称的视图即可完成此工作).然后删除您在自定义视图中关闭的所有不必要的按钮，但但只需将时间栏保持在已覆盖的视图中即可.这样，所有出现/消失的行为都将自动保留在时间栏上，其余的将显示在您自己的视图中.如果您喜欢这种方法，则无需担心处理时间栏.

1 - My suggestion which has worked perfectly for my needs: override default controls view of the exoplayer (having a view with the same name in your layouts folder would do the job). Then remove all unnecessary buttons which you brought down in your custom view but just keep the time bar in overridden view. By doing that, all the appearing / disappearing behaviors are automatically kept for the time bar and you will have the rest in your own view. You wouldn't need to worry about handling the time bar if you liked that approach.

2-如果万一您坚持要在播放器窗口下显示时间栏，则您需要的是水平进度条(请注意，您可以自定义进度视图以匹配您的设计).然后在exoplayer上编写一个侦听器，以获取计时(已通过/剩余/当前播放时间)，并根据这些计时计算和更新小节的进度.请记住，进度条需要可触摸(可聚焦)，以便用户可以前后拖动它.然后，当用户拖动进度时，您将需要重新计算播放时间.(显然，很多编码和计算但几乎是简单的东西).希望对你有效.如果您需要代码示例，请告诉我.

2- Just in case you insist on bringing the time bar out under the player window, what you need is a horizontal progressbar (Notice that you can customize the look of progress view to match your design). Then write a listener on exoplayer to take the timings (passed / remaining / current play-time) and calculate and update the progress of the bar based upon them. Remember that the progress bar needs to be touchable (and focusable) so that the user could drag it back and forth. Then you would need to re-calculate playtime when user drags the progress. (lots of coding and calculations obviously but almost easy stuff). Hope it works for you. If you needed code samples please let me know.

这篇关于如何将Exoplayer的控件放置在PlayerView之外的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！