Create Android Custom Convex Path

Question

I want to customize a custom shape (a different radius for each corner of the rectangle) to my frame layout so that the views in the frame layout are tied to the borders of the form.

    ViewOutlineProvider provider = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                configurePath(getWidth(), getHeight());
                outline.setConvexPath(borderPath);
            }
        }
    };

    setOutlineProvider(provider);
    setClipToOutline(true);

And configurePath()it looks like this:

private void configurePath (int width, int height) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
        return;
    }

    borderPath.rewind();

    float minSize = Math.min(width, height);
    float maxRadiusWidth = 2 * Math.max(Math.max(topLeftRadius, topRightRadius),
            Math.max(bottomLeftRadius, bottomRightRadius));

    if (minSize < maxRadiusWidth) {
        borderPath.addRect(0, 0, width, height, Path.Direction.CCW);
        return;
    }

    // Top left circle
    oval.set(0, 0, 2 * topLeftRadius, 2 * topLeftRadius);
    borderPath.moveTo(0, topLeftRadius);
    borderPath.arcTo(oval, 180, -90);

    borderPath.rLineTo(width - topLeftRadius - topRightRadius, 0);

    // Top right circle
    oval.set(width - 2 * topRightRadius, 0, width, 2 * topRightRadius);
    borderPath.arcTo(oval, 90, -90);

    borderPath.rLineTo(0, height - topRightRadius - bottomRightRadius);

    // Bottom right circle
    oval.set(width - 2 * bottomRightRadius, height - 2 * bottomRightRadius, width, height);
    borderPath.arcTo(oval, 0, -90);

    borderPath.rLineTo(-width + bottomRightRadius + bottomLeftRadius, 0);

    // Bottom left circle
    oval.set(0, height - 2 * bottomLeftRadius, 2 * bottomLeftRadius, height);
    borderPath.arcTo(oval, -90, -90);

    borderPath.rLineTo(0, -height + bottomLeftRadius + topLeftRadius);
}

When I started it, I got it java.lang.IllegalArgumentException: path must be convex, and I couldn’t get in native_isConvex()and see how it decides whether the path is convex.

So what is a convex path? Why is the path in congfigurePath()not convex? How to create your own convex path? Thank.

Answer 1

. , . , , , :

    // Top left circle
    oval.set(0, 0, 2 * topLeftRadius, 2 * topLeftRadius);
    borderPath.moveTo(0, topLeftRadius);
    borderPath.arcTo(oval, -180, 90);

    borderPath.rLineTo(width - topLeftRadius - topRightRadius, 0);

    // Top right circle
    oval.set(width - 2 * topRightRadius, 0, width, 2 * topRightRadius);
    borderPath.arcTo(oval, -90, 90);

    borderPath.rLineTo(0, height - topRightRadius - bottomRightRadius);

    // Bottom right circle
    oval.set(width - 2 * bottomRightRadius, height - 2 * bottomRightRadius, width, height);
    borderPath.arcTo(oval, 0, 90);

    borderPath.rLineTo(-width + bottomRightRadius + bottomLeftRadius, 0);

    // Bottom left circle
    oval.set(0, height - 2 * bottomLeftRadius, 2 * bottomLeftRadius, height);
    borderPath.arcTo(oval, 90, 90);

    borderPath.rLineTo(0, -height + bottomLeftRadius + topLeftRadius);

: , , , .

Answer 2

, , .
xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners
        android:bottomLeftRadius="8dp"
        android:topLeftRadius="8dp"
        android:topRightRadius="8dp"
        android:bottomRightRadius="0dp" />

    <solid android:color="#fff" />

</shape>

RoundRectShape. , xml.
curstructor , . , , (tip: path.addRoundRect()).