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