android xfermode不起作用,【Android】 自定义View那点事（二）Xfermode篇

最新推荐文章于 2022-08-05 20:06:27 发布
最新推荐文章于 2022-08-05 20:06:27 发布
阅读量425 收藏
点赞数
文章标签： android xfermode不起作用

回顾

上一节我们学会了使用Canvas和Paint实现自定义View的绘制，我们已经知道如何简单实现自定义View的方法。这一节我们主要来说说Paint的setXfermode方法，对于Android开发中碰到最多是实现圆角图片或是圆形图片显示，只要掌握了setXfermode的使用就能够实现我们想要的图片显示效果。

setXfermode知多少

想了解Xfermode是什么，当然先去翻翻Android官方开发文档啦。文档中Xfermode提供了三个Subclasses:AvoidXfermode,PixelXorXfermode,PorterDuffXfermode而这节我们先介绍PorterDuffXfermode，这也是和本节要讲的内容相关。其他的放在下次再讲吧。

说说PorterDuffXfermode

既然要说PorterDuffXfermode，它是实现图形混合模式，当要实现复杂显示多个图形重叠时呈现特别的显示方式PorterDuffXfermode就派上用处。PorterDuffXfermode的构造方法需要传递一个PorterDuff.Mode 参数。再查查文档吧，一看吓一跳，Enum Values不少，一共有18种mode。具体每一种模式的实现效果是什么样的？把代码敲起来就知道结果了啊。

public class PorterDuffView extends View {

Paint mPaint;

Context mContext;

int BlueColor;

int PinkColor;

int mWith;

int mHeight;

public PorterDuffView(Context context) {

super(context);

init(context);

}

public PorterDuffView(Context context, AttributeSet attrs) {

super(context, attrs);

init(context);

}

public PorterDuffView(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

init(context);

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

super.onMeasure(widthMeasureSpec, heightMeasureSpec);

mHeight = getMeasuredHeight();

mWith = getMeasuredWidth();

}

private void init(Context context) {

mContext = context;

BlueColor = ContextCompat.getColor(mContext, R.color.colorPrimary);

PinkColor = ContextCompat.getColor(mContext, R.color.colorAccent);

mPaint = new Paint();

mPaint.setStyle(Paint.Style.FILL);

mPaint.setAntiAlias(true);

}

private Bitmap drawRectBm(){

Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);

paint.setColor(BlueColor);

paint.setStyle(Paint.Style.FILL);

paint.setAntiAlias(true);

Bitmap bm = Bitmap.createBitmap(200,200, Bitmap.Config.ARGB_8888);

Canvas cavas = new Canvas(bm);

cavas.drawRect(new RectF(0,0,70,70),paint);

return bm;

}

private Bitmap drawCircleBm(){

Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);

paint.setColor(PinkColor);

paint.setStyle(Paint.Style.FILL);

paint.setAntiAlias(true);

Bitmap bm = Bitmap.createBitmap(200,200, Bitmap.Config.ARGB_8888);

Canvas cavas = new Canvas(bm);

cavas.drawCircle(70,70,35,paint);

return bm;

}

@Override

protected void onDraw(Canvas canvas) {

mPaint.setFilterBitmap(false);

mPaint.setStyle(Paint.Style.FILL);

mPaint.setTextSize(20);

RectF recf = new RectF(20,20,60,60);

mPaint.setColor(BlueColor);

canvas.drawRect(recf,mPaint);

mPaint.setColor(PinkColor);

canvas.drawCircle(100,40,20,mPaint);

int sc = canvas.saveLayer(0, 0,mWith,mHeight, 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);

int y = 180;

int x = 50;

for(PorterDuff.Mode mode : PorterDuff.Mode.values()){

if(y >= 900){

y = 180;

x += 200;

}

mPaint.setXfermode(null);

canvas.drawText(mode.name(),x + 100,y,mPaint);

canvas.drawBitmap(drawRectBm(),x,y,mPaint);

mPaint.setXfermode(new PorterDuffXfermode(mode));

canvas.drawBitmap(drawCircleBm(),x,y,mPaint);

y += 120;

}

mPaint.setXfermode(null);

// 还原画布

canvas.restoreToCount(sc);

}

}

bVCttu

实现效果图，每个模式的效果一目了然。

实践求真知

知道PorterXfermode的使用模式下面我们实践到实际开发中，我们来绘制圆形图片和微信聊天图片。在设计自定义ImageView之前先简单回顾一下Canvas的绘制，对于Canvas的onDraw每执行一次就是在屏幕上增加一个Bitmap覆盖在原来的图层上。绘制自定义形状图片是通过将自定义图形图层和图片资源图层的内容使用PorterDuffXfermode绘制合并而成，那在图层之间PorterDuffXfermode绘制之前。需要使用 canvas.saveLayerAlpha将原图层的内容保存，使得图形图层是和图片资源图层进行绘制操作。在图层绘制结束之后再使用canvas.restoreToCount恢复保存的原图层内容。若不使用原图层保存和恢复的方法的情况肯定达不到原来所想要的效果，但也可以试试了解canvas的绘制原理，看看结果会是怎样。

绘制圆形图片

//

public class CircleImgView extends ImageView {

private int mWidth;

private int mHeight;

private Paint mPaint;

private Bitmap CircleBitmap;

public CircleImgView(Context context) {

super(context);

}

public CircleImgView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public CircleImgView(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

}

private void ImgCircle(){

Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);

paint.setAntiAlias(true);

paint.setFilterBitmap(true);

paint.setColor(Color.GRAY);

paint.setStrokeWidth(5);

paint.setStyle(Paint.Style.FILL);

CircleBitmap = Bitmap.createBitmap(mWidth,mHeight, Bitmap.Config.ARGB_8888);

Canvas canvas = new Canvas(CircleBitmap);

canvas.drawCircle(mWidth/2,mHeight/2,mWidth/2,paint);

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

super.onMeasure(widthMeasureSpec, heightMeasureSpec);

mWidth = getMeasuredWidth();

mHeight = getMeasuredHeight();

mPaint = new Paint();

mPaint.setAntiAlias(true);

mPaint.setFilterBitmap(true);

ImgCircle();

}

@Override

protected void onDraw(Canvas canvas) {

int count = canvas.saveLayerAlpha(0, 0, mWidth, mHeight, 250, Canvas.HAS_ALPHA_LAYER_SAVE_FLAG);

super.onDraw(canvas);

mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));

canvas.drawBitmap(CircleBitmap,0,0, mPaint);

canvas.restoreToCount(count);

}

}

绘制微信聊天图片

public class ImgCustView extends ImageView{

private int mWidth;

private int mHeight;

private Paint mPaint;

private Bitmap canvasBitmap;

public ImgCustView(Context context) {

super(context);

}

public ImgCustView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public ImgCustView(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

}

private void ImgShape(){

Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);

paint.setAntiAlias(true);

paint.setFilterBitmap(true);

paint.setColor(Color.GRAY);

paint.setStyle(Paint.Style.FILL);

canvasBitmap = Bitmap.createBitmap(mWidth,mHeight, Bitmap.Config.ARGB_8888);

Canvas canvas = new Canvas(canvasBitmap);

Path path = new Path();

path.moveTo(mWidth - 25,50);

path.lineTo(mWidth - 25,80);

path.lineTo(mWidth,65);

path.close();

RectF rectF = new RectF(0,0,mWidth - 25,mHeight);

canvas.drawRoundRect(rectF,20,20,paint);

canvas.drawPath(path,paint);

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

super.onMeasure(widthMeasureSpec, heightMeasureSpec);

mWidth = getMeasuredWidth();

mHeight = getMeasuredHeight();

mPaint = new Paint();

mPaint.setAntiAlias(true);

mPaint.setFilterBitmap(true);

ImgShape();

}

@Override

protected void onDraw(Canvas canvas) {

int count = canvas.saveLayerAlpha(0, 0, mWidth, mHeight, 250, Canvas.HAS_ALPHA_LAYER_SAVE_FLAG);

super.onDraw(canvas);

mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));

canvas.drawBitmap(canvasBitmap,0,0, mPaint);

canvas.restoreToCount(count);

}

}

主程序

public class ImgCustActivity extends BaseActivity {

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(500,500);

layoutParams.setMargins(20,20,20,20);

//实例化ImageView并加载图片资源

ImageView imageView = new ImageView(this);

imageView.setScaleType(ImageView.ScaleType.FIT_XY);

imageView.setImageResource(R.drawable.background);

imageView.setLayoutParams(layoutParams);

//实例化圆形ImageView并加载图片资源

ImgCustView imgCustView = new ImgCustView(this);

imgCustView.setScaleType(ImageView.ScaleType.FIT_XY);

imgCustView.setImageResource(R.drawable.background);

imgCustView.setLayoutParams(layoutParams);

//实例化聊天ImageView并加载图片资源

CircleImgView circleView = new CircleImgView(this);

circleView.setScaleType(ImageView.ScaleType.FIT_XY);

circleView.setImageResource(R.drawable.background);

circleView.setLayoutParams(layoutParams);

llContent.setBackgroundColor(Color.LTGRAY);

llContent.addView(imageView);

llContent.addView(imgCustView);

llContent.addView(circleView);

}

}

bVCu3l

最后的效果呈现

写在最后

这节主要学习PorterDuffXfermode模式并通过几个简单例子实践了一下。结合简单例子我们还可以深入学习绘制更为复杂有趣的自定义图形。本节只做到了抛砖迎玉的作用，以后我还会结合其他内容绘制更有意思和创造性的图形。之后还会讲讲关于View的动画，下次见 see you！

冯小僧
关注
android xfermode不起作用,Android PorterDuffXfermode使用中的一些坑
weixin_29501693的博客
05-26 909
概述在android canvas繪圖中經常會使用到Paint.setXfermode()來給畫筆設置一個Xfermode；Xfermode是一種將所繪制的圖形的像素按照一定模式進行混合從而形成新的像素值。Xfermode有三個子類：AvoidXfermode、PixelXorXfermode、PorterDuffXfermode；前兩個已經廢棄了，我們使用的最多的就是PorterDuffXfer...
setXfermode() 不起作用？
Egos 的专栏
01-21 2647
在不理解PorterDuff.Mode的几种模式的时候，经常会导致想象出来的内容和实际画出来的内容不太一样，然后各种想砸手机的冲动。
关于PorterDuffXferMode效果出不来的问题
AndroidDeveloper的专栏
12-12 913
在官方文档中PorterDuffXferMode的效果是这样的 \ 然而实际上当dst和src都不是bitmap的时候，效果是这样的 所以使用PorterDuffXferMode是有条件的,条件如下 1、关闭硬件加速。 2、dst和src都是bitmap并且两个bitmap大小尽量一样。 3、背景色为透明色。 4、如果两个bitmap位置不完全一样，可能也
android xfermode不起作用,Android Xfermode
weixin_29619665的博客
05-26 210
多种混合模式PorterDuffXfermode的构造函数： /*** Create an xfermode that uses the specified porter-duff mode.** [@param](https://my.oschina.net/u/2303379) mode The porter-duff mode that is applied*/publi...
android 画图之setXfermode
daibalusu
10-26 215
http://lipeng88213.iteye.com/blog/1189452 setXfermode 设置两张图片相交时的模式 我们知道 在正常的情况下，在已有的图像上绘图将会在其上面添加一层新的形状。 如果新的Paint是完全不透明的，那么它将完全遮挡住下面的Paint； 而setXfermode就可以来解决这个问题 一般来说 用法是这样的 Canvas canvas =...
android xfermode不起作用,Android刮刮乐效果-proterDuffXfermode的示例代码
weixin_36277197的博客
05-26 142
先看看实现的效果这个场景主要是模拟我们有些app里面的刮刮乐中奖的效果，主要是利用Android的proterDuffXfermode这个类去实现的。proterDuffXfermode在用Android中的Canvas进行绘图时，可以通过使用PorterDuffXfermode将所绘制的图形的像素与Canvas中对应位置的像素按照一定规则进行混合，形成新的像素值，从而更新Canvas中最终的像素...
设置paint.setXfermode(mMode)无效
lanseyuanwei2的博客
10-24 1050
在自定义View的过程中设置paint.setXfermode(mMode);达不到预期的效果 解决方案： 在View的构造函数中关闭硬件加速即可达到预期效果 setLayerType(View.LAYER_TYPE_SOFTWARE, null);
Android自定义view利用Xfermode实现动态文字加载动画
08-29
总结来说，Android自定义View利用Xfermode实现动态文字加载动画的关键在于理解PorterDuffXfermode的工作原理，选择合适的混合模式，并正确地在`onDraw()`方法中设置图层和画笔。掌握这些技术，开发者可以创造出更多...
Android自定义View实现圆形切图效果
01-05
使用自定义View实现圆形ImageView的效果，具体内容如下 目前圆形边框还需要调整,这里有点问题 实现思路 使用一个Paint,将得到的Bitmap设置成paint的Shader,设置完成后,使用Matrix调整图片至居中,使用RectF约束边框,...
Android自定义View实现带4圆角或者2圆角的效果
01-03
实现任意view经过自定义带4圆角或者2圆角的效果 2 原理 1) 实现view 4圆角 我们只需要把左边的图嵌入到右边里面去，最终显示左边的图就行。 2) 实现view上2圆角 我们只需要把左边的图嵌入到右边里面去，最终显示...
Android Xfermode 实战实现圆形、圆角图片
12-23
代码为博客实例代码，有问题请博客留言：http://blog.csdn.net/lmj623565791/article/details/42094215
Android自定义View之轻松实现圆角和圆形图片
AntDream的程序世界
08-10 2719
在日常开发过程中，图片的特效处理是一个很常见的需求。除了颜色特效，还有就是外形的特效，比如圆角图片，圆形图片等。今天我们就来学习下图片的外形特效相关的知识 Paint画笔特效 Paint有一个专门用于处理图片外形特效的API //Paint.class public Xfermode setXfermode(Xfermode xfermode) { long xfermodeNa...
Android Xfermode
qq_39197781的博客
07-23 654
       Xfermode图片混合模式，为什么会有这个东西呢，其实可以类比photoshow的图层，好的不知道。再来，也就是假设我们要在某个图纸上画画，左手画圆，右手画方。然后它们要是互不相干，那自然皆大欢喜，但是如果有相交重叠的部分，如何处理这就是Xfermode要处理的东西了。先上一张图。这张是你选择的这种混合模式应该出现的效果，但可能并不是这么理想，往下看~      &nbs
android Xfermode
文涛的专栏
05-14 2419
1 概述xfermode主要指图像的混合模式，在android中，paint可以设置不同的xfermode来达到不同的效果。 Xfermode有三个子类：AvoidXfermode,PixelXorXfermode,PorterDuffXfermode; 由于前面两个都已经被废弃，并且并不支持硬件加速，所以这里主要讲解PorterDuffXfermode。2 PorterDuffXfermode
Paint的XFormode在Android9.0无效的问题
weixin_42215792的博客
12-10 1322
由于Android在9.0 改变了绘制透明像素的方式，所以导致Xformode无法通过透明像素裁剪或者拼接边界，具体改变如下： SDK_VERSION < 9.0 的情况下： 透明像素按 透明像素绘制 即 hex Color(ARGB): #00000000  SDK_VERSION >= 9.0的情况下 透明像素不在被绘制 由于Xformode 是通过相同位置是否透明 来进...
android中Xfermode的使用
SpringQi
04-20 2285
通过使用Xfermode将绘制的图形的像素和Canvas上对应位置的像素按照一定的规则进行混合，形成新的像素，再更新到Canvas中形成最终的图形。 我们一个像素的颜色都是由四个分量组成，即ARGB，A表示的是我们Alpha值，RGB表示的是颜色 S表示的是源像素，源像素的值表示[Sa,Sc] Sa表示的就是源像素的Alpha值，Sc表示源像素的颜色值 D表示的是目标像素，目标像素的值表示[Da,...
Android中Xfermode简单用法
Halifax
09-04 2891
Android Xfermode简单用法介绍
Android setXfermode之ProterXfermode
cycy1821的博客
08-05 624
setXfermode之ProterXfermode
ImageView 绘制圆角效果_Xfermode
yuminfeng728的博客
01-02 734
前言Android 开发中，我们经常需要实现图片的圆形/圆角的效果，我们可以使用两种方式来实现这样的效果。一种是使用Xfermode，另一种是BitmapShader来实现。下面我将分别介绍这两种用法。使用Xfermode的方式实现 使用该方式的关键代码
Android自定义View：Xfermode实现文字动态加载动画详解
本文主要介绍了如何在Android开发中利用Xfermode实现自定义View的动态文字加载动画，为读者提供了一个实用且易于理解的方法。Xfermode在Android中扮演着图形混合操作的角色，类似于数学中的集合概念，可以用来组合、...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值