Android 橡皮擦功能,图层混合模式PorterDuff.Mode实践

先上效果图:

 

 使用图层混合模式注意点:

1.图层类型设置为软件类型,有些api不支持硬件类型,默认视图是没有开启图层的

setLayerType(LAYER_TYPE_SOFTWARE, null);

2.创建新的图层来完成混合模式的运算(离屏绘制),然后更新到原始图层。如果直接在原始图层进行混合模式运算,原始图层的某些操作可能会影响混合模式运算结果,得不到预期的效果

//离屏绘制
int layer = canvas.saveLayer(0, 0, width, height, paint);
//......
//......
//恢复图层
canvas.restoreToCount(layer);

3.搞清楚哪个是目标图像,哪个是源图像,我的理解是先绘制目标图像,画笔设置混合模式,然后绘制的是源图像

//绘制目标图像
canvas.drawBitmap(dstBitmap, 0, 0, paint);
//设置混合模式
paint.setXfermode(porterDuffXfermode);
//绘制源图像
canvas.drawBitmap(srcBitmap, null, srcRect, paint);

4.混合模式计算完之后,清除画笔设置的混合模式,以免影响其他绘制效果

//清除混合模式
paint.setXfermode(null);

最后上完整代码,大家自行体会

package com.example.myapplication;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

import androidx.annotation.Nullable;

/**
 * @author xushibin
 * @date 11/24/21
 * description:
 */
public class EraserView extends View {
    //控件宽高
    private int width;
    private int height;

    private Paint textPaint;

    private Paint paint;
    private Bitmap srcBitmap;
    private Bitmap dstBitmap;
    private Paint pathPaint;
    private Path path;

    private Canvas canvas1;
    private Rect srcRect;

    private PorterDuffXfermode porterDuffXfermode;

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

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

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

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

    private void init() {
        //设置图层类型为软件类型,有些api不支持硬件类型
        setLayerType(LAYER_TYPE_SOFTWARE, null);

        //文字paint
        textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        textPaint.setColor(0xffff0000);
        textPaint.setTextAlign(Paint.Align.CENTER);
        textPaint.setTextSize(100);
        textPaint.setFakeBoldText(true);

        //橡皮擦paint
        pathPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        pathPaint.setStyle(Paint.Style.STROKE);
        pathPaint.setStrokeWidth(10);
        path = new Path();

        //混合图像paint
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);

        //遮罩层
        srcBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.eraser);

        //混合模式
        porterDuffXfermode = new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);

        dstBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        canvas1 = new Canvas(dstBitmap);

        //绘制bitmap,缩放到控件宽高
        srcRect = new Rect(0, 0, w, h);

        //设置控件宽高
        width = w;
        height = h;
    }

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

        Paint.FontMetrics fontMetrics = textPaint.getFontMetrics();
        //计算基线位置,让文字居中
        float baseline = height * 1.0f / 2 + (fontMetrics.descent - fontMetrics.ascent) / 2 - fontMetrics.descent;
        //原始canvas中画文字
        canvas.drawText("中奖了", width * 0.5f, baseline, textPaint);

        //离屏绘制
        int layer = canvas.saveLayer(0, 0, width, height, paint);

        //绘制橡皮擦路径,图层混合后变为透明像素
        canvas1.drawPath(path, pathPaint);
        //绘制目标图像
        canvas.drawBitmap(dstBitmap, 0, 0, paint);
        //设置混合模式
        paint.setXfermode(porterDuffXfermode);
        //绘制源图像
        canvas.drawBitmap(srcBitmap, null, srcRect, paint);
        //清除混合模式
        paint.setXfermode(null);

        //恢复图层
        canvas.restoreToCount(layer);
    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {

        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:

                float mX = event.getX();
                float mY = event.getY();
                path.moveTo(mX, mY);
                break;

            case MotionEvent.ACTION_MOVE:
                path.lineTo(event.getX(), event.getY());
                break;

            case MotionEvent.ACTION_UP:
                path.reset();
                break;
        }

        invalidate();
        return true;
    }

    @Override
    protected void onDetachedFromWindow() {
        pathPaint = null;
        paint = null;
        textPaint = null;
        super.onDetachedFromWindow();
    }

    /**
     * 清除目标图像绘制路径,遮罩层就恢复了
     */
    public void restore() {
        canvas1.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
        invalidate();
    }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值