Android开发：如何让子View不超出XML绘制的圆形边界？

嘿，我来帮你搞定这个圆形裁剪的难题！你遇到的核心问题是：虽然RelativeLayout的背景是椭圆形，但它本身的布局边界还是矩形，系统默认不会自动裁剪超出椭圆范围的子View。之前尝试的PorterDuff.Mode没生效，大概率是没满足图层混合的前置条件，下面给你两个靠谱的解决方案：

方案一：用ViewOutlineProvider（推荐，API 21+） #

这是Android官方推荐的裁剪方式，简单高效，只需要两步：

1. 先调整你的布局代码，去掉没用的clipChildren和adjustViewBounds属性（它们对圆形裁剪起不到作用），保留核心结构：

<RelativeLayout 
    android:id="@+id/white_rectangle" 
    android:layout_width="327dp" 
    android:layout_height="211.5dp" 
    android:layout_gravity="center" 
    android:background="@drawable/circle" >

    <View 
        android:id="@+id/scanner" 
        android:layout_width="123.5dp" 
        android:layout_height="211.5dp" 
        android:layout_gravity="center" 
        android:background="@drawable/scanner" 
        android:visibility="gone" />
</RelativeLayout>

2. 在Activity或Fragment的代码里，给RelativeLayout设置椭圆形轮廓并开启裁剪：

// 获取布局实例
RelativeLayout whiteRectangle = findViewById(R.id.white_rectangle);

// 设置自定义轮廓提供者，让View按照椭圆形裁剪
whiteRectangle.setOutlineProvider(new ViewOutlineProvider() {
    @Override
    public void getOutline(View view, Outline outline) {
        // 用View自身的宽高创建椭圆轮廓，和背景的椭圆形完全匹配
        outline.setOval(0, 0, view.getWidth(), view.getHeight());
    }
});

// 开启裁剪功能，这一步是关键！
whiteRectangle.setClipToOutline(true);

注意：这个方法要求API 21及以上，如果你的App需要兼容更低版本，看下面的方案二。

方案二：自定义ClipDrawable（兼容低版本） #

如果要支持API 21以下，可以通过自定义Drawable结合PorterDuff.Mode来实现裁剪：

1. 创建一个圆形裁剪的自定义Drawable类：

public class CircleClipDrawable extends Drawable {
    private Paint mPaint;
    private RectF mRectF = new RectF();

    public CircleClipDrawable(Drawable drawable) {
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        // 使用SRC_IN模式，只显示重叠区域
        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        // 将传入的Drawable转为BitmapShader，作为绘制的内容
        drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
        mPaint.setShader(new BitmapShader(drawableToBitmap(drawable), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
    }

    @Override
    protected void onBoundsChange(Rect bounds) {
        super.onBoundsChange(bounds);
        mRectF.set(bounds);
    }

    @Override
    public void draw(@NonNull Canvas canvas) {
        // 绘制椭圆形裁剪区域
        canvas.drawOval(mRectF, mPaint);
    }

    @Override
    public void setAlpha(int alpha) {
        mPaint.setAlpha(alpha);
    }

    @Override
    public void setColorFilter(@Nullable ColorFilter colorFilter) {
        mPaint.setColorFilter(colorFilter);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }

    // 工具方法：将Drawable转为Bitmap
    private Bitmap drawableToBitmap(Drawable drawable) {
        if (drawable instanceof BitmapDrawable) {
            return ((BitmapDrawable) drawable).getBitmap();
        }
        Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
        drawable.draw(canvas);
        return bitmap;
    }
}

2. 在代码中给scanner View设置这个裁剪Drawable：

View scanner = findViewById(R.id.scanner);
Drawable scannerBg = getResources().getDrawable(R.drawable.scanner);
scanner.setBackground(new CircleClipDrawable(scannerBg));

另外，给你提个小优化：你的circle.xml里的<corners>标签是多余的，因为android:shape="oval"已经定义了椭圆形，删掉它就好：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
    <stroke android:width="2dp" android:color="@android:color/white" />
    <size android:width="327dp" android:height="211.5dp" />
</shape>

为啥之前的PorterDuff.Mode没生效？ #

通常是因为没满足两个关键条件：一是没有关闭硬件加速（部分场景下图层混合需要关闭），二是没有正确设置图层的绘制顺序。而ViewOutlineProvider是系统原生的裁剪方案，不需要处理这些复杂的细节，所以更稳定可靠。

内容的提问来源于stack exchange，提问作者Maxim Toyberman