自定义Shape半圆角效果的问题

Android_Drawable

需求：半圆矩形效果，不用贴图的方式

将shape的radius设置大于控件的大小后就会产生半圆形的矩形效果

分别给4个设置角度，相同圆角，理论上效果应该要和下面的方式一样的

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#f00" />
    <corners
        android:bottomLeftRadius="100dp"
        android:bottomRightRadius="100dp"
        android:topLeftRadius="100dp"
        android:topRightRadius="100dp" />
</shape>

只设置一个角度，代表4个相同的圆角

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#f00" />
    <corners android:radius="100dp" />
</shape>

将上面2个shape文件设置到相同的View上，查看运行效果图
在4.3以上的效果

在4.3以下的效果

可以看到使用单独设置一个radius的方式在不同版本都是我们想要的半圆形效果，但是分别设置圆角的在4.3版本以下的设备显示却不是我们要的效果。

如果想要某个边上半圆角效果，但是在低版本上还是有问题的，表现出的不是半圆而是半椭圆。

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#f00" />
    <corners
        android:bottomLeftRadius="100dp"
        android:topLeftRadius="100dp" />
</shape>

源码解析

GradientDrawable的draw方法

public void draw(Canvas canvas) {
    // ...
        switch (st.mShape) {
            case RECTANGLE:
                // 单独分别设置圆角的情况下，不同版本这里实现有些不同，使用Path的方式处理
                if (st.mRadiusArray != null) {
                    buildPathIfDirty();
                    canvas.drawPath(mPath, mFillPaint);
                    if (haveStroke) {
                        canvas.drawPath(mPath, mStrokePaint);
                    }
                } else if (st.mRadius > 0.0f) { // 只设置radius的情况下，直接画圆角矩形
                    // since the caller is only giving us 1 value, we will force
                    // it to be square if the rect is too small in one dimension
                    // to show it. If we did nothing, Skia would clamp the rad
                    // independently along each axis, giving us a thin ellipse
                    // if the rect were very wide but not very tall
                    // 取矩形宽高的一半或者圆角最小的一个作为半径画圆角矩形
                    float rad = Math.min(st.mRadius,
                            Math.min(mRect.width(), mRect.height()) * 0.5f);
                    canvas.drawRoundRect(mRect, rad, rad, mFillPaint);
                    if (haveStroke) {
                        canvas.drawRoundRect(mRect, rad, rad, mStrokePaint);
                    }
                } else { // 纯矩形
                    if (mFillPaint.getColor() != 0 || colorFilter != null ||
                            mFillPaint.getShader() != null) {
                        canvas.drawRect(mRect, mFillPaint);
                    }
                    if (haveStroke) {
                        canvas.drawRect(mRect, mStrokePaint);
                    }
                }
                break;    
}

解决方案

1. 对于需要2边都是半圆效果的，用单独设置相同的radius的方式，而不用分别设置的方式来避免。
2. 对于想要1边半圆角效果来说，需要自定义View来绘制一边的半圆效果

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
    super.onLayout(changed, left, top, right, bottom);
    rectF.set(0, 0, getWidth(), getHeight());
    int radius = getHeight() / 2;
    //  { 0, 0, r, r, r, r, 0, 0}
    radii[2] = radii[3] = radii[4] = radii[5] = radius;
    path.addRoundRect(rectF, radii, Path.Direction.CW);
}