canvas选区：ClipRect

最新推荐文章于 2024-01-29 23:16:19 发布

Mars-xq

最新推荐文章于 2024-01-29 23:16:19 发布

阅读量902

点赞数

分类专栏：自定义view之路自定义view

本文链接：https://blog.csdn.net/sinat_31057219/article/details/78530035

版权

自定义view 同时被 2 个专栏收录

43 篇文章 1 订阅

订阅专栏

自定义view之路

29 篇文章 0 订阅

订阅专栏

参考：android clipRect Op.xxx各个参数理解

canvas的选区：

这里写图片描述

Op参数：

这里写图片描述

DIFFERENCE //是第一次不同于第二次的部分显示出来
REPLACE //是显示第二次的
REVERSE_DIFFERENCE //是第二次不同于第一次的部分显示
INTERSECT //交集显示（默认）
UNION //全部显示
XOR //补集 就是全集的减去交集生育部分显示

注意：

clipxx的作用，设置画布的显示区域，

clipxx方法只对设置以后的drawxx起作用，已经画出来的图形，是不会有作用的。

如果画图之后再对canvas进行clip不会影响到已经画好的图形。

一定要记住clip是针对canvas而非图形。

选区操作最好在canvas.save();和canvas.restore(); 之间进行。如下：

canvas.save();  
canvas.clipRect(x1, y1, x1 + w, y1 + h);  
canvas.drawBitmap(bitmap, x2, y2, paint);  
canvas.restore();

示例：

效果图：

显示两次选区区域：蓝色为第一次选区，黄色为第二次选区

这里写图片描述

只显示第一次选区：蓝色部分

这里写图片描述

只显示第二次选区：黄色部分

这里写图片描述

不显示两次选区区域：

这里写图片描述

自定义ClipView ：

public class ClipView extends View {

    private Paint mPaint;
    private Region.Op op;

    public ClipView(Context context) {
        super(context);
        init();
    }

    public ClipView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public ClipView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setDither(true);
        mPaint.setStrokeWidth(5);
        mPaint.setStyle(Paint.Style.STROKE);
    }

    public void setOp(Region.Op op) {
        this.op = op;
    }


    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        canvas.clipRect(0, 0, 200, 200);//第一次选区
//        canvas.drawColor(Color.BLUE);

        if (op != null) {
            canvas.clipRect(100, 100, 300, 300, op);//第二次选区
//            canvas.drawColor(Color.YELLOW);
        }

        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setColor(Color.RED);
        canvas.drawRect(new Rect(0, 0, 150, 150), mPaint);//绘制图形
    }
}

布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#e5e5e5"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:orientation="horizontal">


        <com.android.imooc.ClipView
            android:id="@+id/clip1"
            android:layout_width="0dp"
            android:layout_height="100dp"
            android:layout_weight="1"
            android:background="#cccccc" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="20dp"
            android:layout_weight="1"
            android:gravity="center"
            android:text="红色为要绘制的图形\n蓝色为第一次选区\n黄色为第二次选区" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="DIFFERENCE:\n第一次选区减去交集" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="INTERSECT:\n两次选区的交集" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <com.android.imooc.ClipView
                android:id="@+id/clip2"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_weight="1"
                android:background="#cccccc" />

            <com.android.imooc.ClipView
                android:id="@+id/clip3"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginLeft="20dp"
                android:layout_weight="1"
                android:background="#cccccc" />

        </LinearLayout>
    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="UNION:\n两次选区的并集" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="XOR:\n两次选区的并集减去交集" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <com.android.imooc.ClipView
                android:id="@+id/clip4"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_weight="1"
                android:background="#cccccc" />

            <com.android.imooc.ClipView
                android:id="@+id/clip5"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginLeft="20dp"
                android:layout_weight="1"
                android:background="#cccccc" />

        </LinearLayout>
    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="REVERSE_DIFFERENCE:\n第二次选区减去交集" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center"
                android:text="REPLACE:\n第二次选区" />

        </LinearLayout>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <com.android.imooc.ClipView
                android:id="@+id/clip6"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_weight="1"
                android:background="#cccccc" />

            <com.android.imooc.ClipView
                android:id="@+id/clip7"
                android:layout_width="0dp"
                android:layout_height="100dp"
                android:layout_marginLeft="20dp"
                android:layout_weight="1"
                android:background="#cccccc" />

        </LinearLayout>
    </LinearLayout>
</LinearLayout>

Activity ：

public class RoundActivity extends FragmentActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.round1);
        ClipView clip1 = ((ClipView) this.findViewById(R.id.clip1));

        ClipView clip2 = ((ClipView) this.findViewById(R.id.clip2));
        clip2.setOp(Region.Op.DIFFERENCE);

        ClipView clip3 = ((ClipView) this.findViewById(R.id.clip3));
        clip3.setOp(Region.Op.INTERSECT);

        ClipView clip4 = ((ClipView) this.findViewById(R.id.clip4));
        clip4.setOp(Region.Op.UNION);

        ClipView clip5 = ((ClipView) this.findViewById(R.id.clip5));
        clip5.setOp(Region.Op.XOR);

        ClipView clip6 = ((ClipView) this.findViewById(R.id.clip6));
        clip6.setOp(Region.Op.REVERSE_DIFFERENCE);

        ClipView clip7 = ((ClipView) this.findViewById(R.id.clip7));
        clip7.setOp(Region.Op.REPLACE);

    }
}

Mars-xq

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
canvas选区：ClipRect

canvas的选区：Op参数：DIFFERENCE //是第一次不同于第二次的部分显示出来REPLACE //是显示第二次的REVERSE_DIFFERENCE //是第二次不同于第一次的部分显示INTERSECT //交集显示UNION //全部显示XOR //补集就是全集的减去交集生育部分显示注意：clipxx的作用，设置画布的显示区域，clipxx方法只对设置以后的drawxx起作
复制链接

扫一扫

专栏目录