canvas选区：ClipRect

来源：互联网发布：浙江软件评测中心编辑：程序博客网时间：2024/05/18 03:49

参考：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);    }}

阅读全文

0 0