android 画图之setXfermode

最新推荐文章于 2022-08-05 20:06:27 发布

会飞牛牛

最新推荐文章于 2022-08-05 20:06:27 发布

阅读量526

点赞数

分类专栏： android

android 专栏收录该内容

216 篇文章 0 订阅

订阅专栏

setXfermode

设置两张图片相交时的模式

我们知道在正常的情况下，在已有的图像上绘图将会在其上面添加一层新的形状。如果新的Paint是完全不透明的，那么它将完全遮挡住下面的Paint；

而setXfermode就可以来解决这个问题

一般来说用法是这样的

[java] view plain copy print ?

Canvas canvas = new Canvas(bitmap1);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(mask, 0f, 0f, paint);

Canvas canvas = new Canvas(bitmap1);

paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));

canvas.drawBitmap(mask, 0f, 0f, paint);

就是在图片bitmap1上面绘制图片mask时处理两者相交时候显示的问题

canvas原有的图片可以理解为背景就是dst
新画上去的图片可以理解为前景就是src

Mode的值如下图

最近在开发一个小游戏中，用到一个显示当前进度的进度条，如下图所示

由于中间黄色部分是进度条区域，带有一定的弧度而不是规则的长方形。刚开始想偷懒用了很多办法来实现效果都不理想。后来想到使用遮罩层可以非常方便的实现这个功能。

可以通过修改Paint的Xfermode来实现遮罩的效果。Xfermode的功能非常强大，在API DEMO的Graphics中的最后一项有demo。看一下怎么实现我们的这个进度条吧。

首先用图片处理软件制作一个和中间黄色区域相同的图形，我们将在代码中设置它做为遮罩。

View的draw方法

      Java代码 
       
    
 public void draw(Canvas canvas) { 
 //背景部分，也就是上面的图形 
 Bitmap background = BitmapFactory.decodeResource(getResources(), 
 R.drawable.guage); 
 //遮罩，就是提取来部分 
 Bitmap mask = BitmapFactory.decodeResource(getResources(), 
 R.drawable.mask); 
 
 canvas.drawColor(Color.WHITE); 
 canvas.drawBitmap(background,  0, 0,  null); 
 Paint paint =  new Paint(); 
 paint.setFilterBitmap(false); 
 
 int x = 0; 
 int y = 0; 
 
 // draw the src/dst example into our offscreen bitmap 
 int sc = canvas.saveLayer(x, y, x + background.getWidth(), y + background.getHeight(), null,  
 Canvas.MATRIX_SAVE_FLAG | Canvas.CLIP_SAVE_FLAG  
 | Canvas.HAS_ALPHA_LAYER_SAVE_FLAG 
 | Canvas.FULL_COLOR_LAYER_SAVE_FLAG 
 | Canvas.CLIP_TO_LAYER_SAVE_FLAG); 
 // canvas.drawBitmap(mDstB, 0, 0, paint); 
 canvas.drawRect(0, 0, background.getWidth() /  2, background 
 .getHeight(), paint); 
 paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 
 // canvas.drawBitmap(mSrcB, 0, 0, paint); 
 canvas.drawBitmap(mask, 0f, 0f, paint); 
 paint.setXfermode(null); 
 canvas.restoreToCount(sc); 
 
 } 