How to make a rounded Exoplayer PlayerView in Android

Question

Hi I am trying to create a rounded video player, and I am using the Exoplaye2 library. I am putting the PLayerView inside a rounded FrameLayout, but don't know how to make the PlayerView itself rounded. I have tried this but it is not working, I even created a rounded_shape_drawable and added it to the background of the Playeview, but it is not working (basically, setting the background for a PlayeView is not working at all).

Below is my simple layout file:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_gravity="center_horizontal"
    android:layout_marginBottom="25dp"
    android:layout_weight="4"
    android:gravity="center"
    android:orientation="horizontal"
    android:weightSum="1">

    <FrameLayout
        android:id="@+id/player_view_layout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.6"
        android:padding="10dp"
        android:background="@drawable/rounded_video_layout">

        <com.google.android.exoplayer2.ui.PlayerView

            android:id="@+id/exoplayer_player_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:fastforward_increment="@integer/exoplayer_playback_fastforward_increment_ms"
            app:resize_mode="fill"
            app:rewind_increment="@integer/exoplayer_playback_rewind_increment_ms"
            app:show_timeout="@integer/exoplayer_show_control_timeout_ms"
            app:use_artwork="true"
            app:use_controller="false">

        </com.google.android.exoplayer2.ui.PlayerView>

    </FrameLayout>

</LinearLayout>

And below is my current output:

Any help will be appreciated

You could make a drawable resource with blacked out rounded corners and a fully transparent middle, then overlay that inside an `ImageView` on top of your video player? — privatestaticint, Jan 24 '19 at 20:58

Davi · Accepted Answer · 2019-02-19T16:35:57.383

29

After a long search, I wasn't able to make rounded corners PlayerView or ImageView in xml only (I don't think it is possible). So I decided to do it in java. Below is the code:

playerView.setOutlineProvider(new ViewOutlineProvider() {
            @Override
            public void getOutline(View view, Outline outline) {
                outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), 15);
            }
        });

        playerView.setClipToOutline(true);

edited Feb 19 '19 at 16:35

answered Feb 19 '19 at 15:24

Davi

1,031
12
21

1

didn't work for me. player doesn't appear in my case. removing this code works fine but corners are not rounded. – Usman Rana Jul 07 '21 at 12:25
1

needs `surface_type="texture_view"` to make this solution work – Jekton Dec 21 '21 at 07:36

score 10 · Answer 2 · answered May 07 '19 at 10:41

May be you can use CardView like this and PlayerView surface_type must be texture_view.

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp"
    app:cardElevation="0dp">

    <com.google.android.exoplayer2.ui.PlayerView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:surface_type="texture_view" 
        app:use_controller="false" />

</android.support.v7.widget.CardView>

score 2 · Answer 3 · answered Jan 24 '19 at 21:31

2

On your FrameLayout, remove the padding then call clipToOutline() on that view e.g

player_view_layout.clipToOutline()

By default the view background is used as the outline provider for a view, so if the background drawable has rounded corners, all content in FrameLayout will be clipped to match.

https://developer.android.com/training/material/shadows-clipping

answered Jan 24 '19 at 21:31

veritas1

8,740
6
27
37

I tried this before and it is not working. The problem is that the PlayerView doesn't change in respect to its parent – Davi Jan 24 '19 at 21:39
@DavI have this code in a project and it works fine. – veritas1 Jan 24 '19 at 21:52

How to make a rounded Exoplayer PlayerView in Android

3 Answers3