Brbcod1
Brbcod1

Reputation: 165

Custom logic for exoplayer controller

I've managed to create a custom controller for my exoplayer. In this layout I placed a few buttons and some other elements that i would like to be able to control (add some events, change text, etc...). What class do I have to extend? How do I "link" the controller with my custom logic? Here's what I've done so far:

<com.google.android.exoplayer2.ui.PlayerView
            android:id="@+id/player"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            app:show_buffering="when_playing"
            app:controller_layout_id="@layout/customController"/>

In customController.xml i have stuff like this:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="350dp"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:orientation="vertical">
<TextView
    android:id="@+id/fileName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Change me!"/>

Thanks!

Upvotes: 1

Views: 6446

Answers (1)

BEN TEN
BEN TEN

Reputation: 58

You should change the custom layout button ids to the default ids used by exo player. And then set the custom layout in the exo player view.you have set it correctly. Only need to change the ids. Then it will work.

When a PlayerView is instantiated it inflates its layout from the layout file exo_player_view.xml. PlayerControlView inflates its layout from exo_player_control_view.xml. To customize these layouts, an application can define layout files with the same names in its own res/layout* directories. These layout files override the ones provided by the ExoPlayer library.

As an example, suppose we want our playback controls to consist of only a play/pause button positioned in the center of the view. We can achieve this by creating exo_player_control_view.xml file in the application’s res/layout directory,

So now you have created the custom layout. Now change the ids of all the ui elements in the custom layout to the original ID used by exo player controller layout.. Below is the original layout code in exo player. Take the default ids from id and paste in your custom layout.

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:layoutDirection="ltr" android:background="#CC000000" android:orientation="vertical" tools:targetApi="28">
   <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_prev" style="@style/ExoMediaButton.Previous" />
      <ImageButton android:id="@id/exo_rew" style="@style/ExoMediaButton.Rewind" />
      <ImageButton android:id="@id/exo_shuffle" style="@style/ExoMediaButton" />
      <ImageButton android:id="@id/exo_repeat_toggle" style="@style/ExoMediaButton" />
      <ImageButton android:id="@id/exo_play" style="@style/ExoMediaButton.Play" />
      <ImageButton android:id="@id/exo_pause" style="@style/ExoMediaButton.Pause" />
      <ImageButton android:id="@id/exo_ffwd" style="@style/ExoMediaButton.FastForward" />
      <ImageButton android:id="@id/exo_next" style="@style/ExoMediaButton.Next" />
      <ImageButton android:id="@id/exo_vr" style="@style/ExoMediaButton.VR" />
   </LinearLayout>
   <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="4dp" android:gravity="center_vertical" android:orientation="horizontal">
      <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" />
      <View android:id="@id/exo_progress_placeholder" 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 in the activity you can find the player view by the findViewById method.

PlayerView playerView = findViewById(R.id.video_view);

And then simply set the media player to the player view

Simple Exoplayer  player = ExoPlayerFactory.newSimpleInstance(this); playerView.setPlayer(player); 

Now you can do everything from your playerView reference. No need to extend classes and do other stuff. And remember to initiate player in on start and close in on stop..

Link to the documentation is below. You can find more details there.

Exo Player Documentation Link

If you want to extend class use the example below. But I think no need to do it. You can attach a player state listener and also you can play pause do everything from the reference to the player.

Extend class example link

Upvotes: 2

Related Questions