Adaptative radius on CardView

Question

I have a problem , I hope you will bring me some informations. In order to have a circular VideoView , I put it in a CardView

<android.support.v7.widget.CardView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:id="@+id/cardVideo"
                    app:cardCornerRadius="180dp"
                    android:background="#000">

                    <com.twilio.video.VideoView
                        android:id="@+id/videoView"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:visibility="visible" />
                </android.support.v7.widget.CardView>

But the problem is that I'm building my application on multiple tablet and the cardCornerRadius isn't adapted to screen size , 180dp is too big for a 8 inch tablet so my VideoView appears in DIAMONDS see :

and for example in a 10 inch tablet it's a perfect circle :

I tried to get device inches programmatically and use setRadius() depend on it but it's not perfect and I don't think that it's the correct way.

What can I do to find the good corner radius adapted to tablet ? Thanks

Answer 1

Ok, I found your answer:

Add this class in your project

package com.example.myapplication;

import android.content.Context;
import android.graphics.*;
import android.util.AttributeSet;
import android.widget.FrameLayout;

public class RoundedCornerLayout extends FrameLayout {

    private Path path = new Path();

    public RoundedCornerLayout(Context context) {
        super(context);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);

        // compute the path
        float halfWidth = w / 2f;
        float halfHeight = h / 2f;
        float centerX = halfWidth;
        float centerY = halfHeight;
        path.reset();
        path.addCircle(centerX, centerY, Math.min(halfWidth, halfHeight), Path.Direction.CW);
        path.close();

    }

    @Override
    protected void dispatchDraw(Canvas canvas) {
        int save = canvas.save();
        canvas.clipPath(path);
        super.dispatchDraw(canvas);
        canvas.restoreToCount(save);
    }
}

and put your VideoView inside it. like here :

<com.example.myapplication.RoundedCornerLayout
        android:layout_width="100dp"
        android:layout_height="100dp">

    // place your VideoView 
    <ImageView
            android:layout_width="match_parent"
            android:src="@color/colorPrimary"
            android:layout_height="match_parent"/>

</com.example.myapplication.RoundedCornerLayout>

references : 1 2