ExoPlayer: Place controller under the video without overlapping the video

Sasha Shpota picture Sasha Shpota · Aug 5, 2018 · Viewed 8.2k times · Source

I have a PlayerView that takes up the top half of the Activity in portrait orientation with the bottom half of the screen showing some text.

I need to have the controller under the video without overlapping the video content (it will always be shown). By default when a user touches the video the controller appears at the bottom of the video covering the bottom part of the video. I my case I need the controller to stick under the video with no intersections with the video content.

I went through SimpleExoPlayer and PlayerView APIs but I haven't found any way to do so.

Question: How can I place the controller under the video with ExoPlayer?

Here is how the layout looks like:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/video_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_below="@id/video_view"
        android:scrollbars="vertical" />

</RelativeLayout>

Answer

Pierre picture Pierre · Aug 7, 2018

This will push the controls down to the bottom of the screen:

<RelativeLayout 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="match_parent">

    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/video_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:use_controller="false" />

    <com.google.android.exoplayer2.ui.PlayerControlView
        android:id="@+id/controls"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/video_view"
        app:show_timeout="0" />

</RelativeLayout>

Then in Java:

PlayerView videoView = findViewById(R.id.video_view);
PlayerControlView controls = findViewById(R.id.controls);
controls.setPlayer(videoView);

Edit: Modified my answer to suggestion from @RashimiGautam