600字范文 > Paint滤镜效果实现各种阴影效果包括不规则图形

Paint滤镜效果实现各种阴影效果包括不规则图形

时间：2023-02-28 03:22:57

paint的滤镜效果，即对图像进行一定的过滤处理，可以实现如模糊阴影效果，浮雕效果，高亮图片，黑白照片，复古照片等效果。

Android的绘图颜色值是32位的int值，即ARGB ：A—Alpha值，RGB—颜色值，根据对Alpha和RGB值的处理，滤镜的实现方式分类有：Alpha滤镜处理，颜色RGB的滤镜处理(矩阵Matrix实现)和两者混合叠加—Matrix，PortDuffColorFilter。

一、Alpha滤镜处理:

通过Paint的setMaskFilter(MaskFilter maskfilter)方法，就可以实现不同的Alpha滤镜效果。setMaskFilter需要传MaskFilter 类型的参数，查看源码可以发现，MaskFilter 有两个子类：BlurMaskFilter和EmbossMaskFilter。

BlurMaskFilter：可以用来绘制模糊阴影

EmbossMaskFilter：可以用来实现浮雕效果

1、BlurMaskFilter滤镜的使用：

BlurMaskFilter的唯一构造函数：

/*** Create a blur maskfilter.** @param radius 阴影的半径大小* @param style 滤镜采用的类型，在BlurMaskFilter类的内部由一个枚举类型指定*/public BlurMaskFilter(float radius, Blur style)

Blur 类型如下：

public enum Blur {/*** 整个图像都会被模糊掉*/NORMAL(0),/*** 图像边界外产生一层与Paint(图像)颜色一致的阴影效果，不影响图像的本身*/SOLID(1),/*** 图像边界外产生一层阴影，并且将图像变成透明效果*/OUTER(2),/*** 在图像内部边沿产生模糊效果*/INNER(3);}

下面是实例：

1.1正常情况下，画一个矩形，代码如下：

Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.RED);RectF rectF = new RectF(100, 100, 400, 400);canvas.drawRect(rectF, paint);

实现效果如图：

为paint设置滤镜效果:

1.2 BlurMaskFilter.Blur.NORMAL模式：整个图像都会被模糊掉

Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.RED);RectF rectF = new RectF(100, 100, 400, 400);paint.setMaskFilter(new BlurMaskFilter(50, BlurMaskFilter.Blur.NORMAL));canvas.drawRect(rectF, paint);

实现效果如下：可以看到整个图片都被模糊了

1.3、BlurMaskFilter.Blur.SOLID模式：图像边界外产生一层与Paint(图像)颜色一致的阴影效果，不影响图像的本身

实现效果：

1.4、BlurMaskFilter.Blur.OUTER:图像边界外产生一层阴影，并且将图像变成透明效果

实现效果：

1.5、BlurMaskFilter.Blur.INNER模式：在图像内部边沿产生模糊效果

实现效果：

至此，BlurMaskFilter的4中模式介绍完毕。

实现不规则图形的阴影效果：

为不规则图形，绘制阴影：

Bitmap bitmap = mBitmap;Bitmap extractAlpha = bitmap.extractAlpha();mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);mPaint.setColor(Color.BLACK);mBlurMaskFilter = new BlurMaskFilter(shaderSize, BlurMaskFilter.Blur.NORMAL);mPaint.setMaskFilter(mBlurMaskFilter);// 绘制图形透明层的阴影canvas.drawBitmap(extractAlpha, null, mShadowRect, mPaint);// 绘制原图canvas.translate(shaderSize, shaderSize);canvas.drawBitmap(bitmap, 0, 0, null);

实现效果：

2、EmbossMaskFilter滤镜效果的使用：

EmbossMaskFilter类的唯一构造函数：

/*** Create an emboss maskfilter** @param direction 指定光源的位置，长度为xxx的数组标量，array of 3 scalars [x, y, z]指定光源的方向* @param ambient 环境光的因子（0~1），越接近0的时候，环境光越暗* @param specular 镜面反射系数，，越接近0，镜面反射越强* @param blurRadius 模糊半径,值越大，模糊效果越明显*/public EmbossMaskFilter(float[] direction, float ambient, float specular, float blurRadius)

使用方式如下：

Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.RED);RectF rectF = new RectF(100, 100, 600, 600);paint.setMaskFilter(new EmbossMaskFilter(new float[]{1, 1, 1}, 0.2f, 60, 80));canvas.drawRect(rectF, paint);

实现效果：

二、颜色RGB的滤镜处理：

对颜色值RGB的滤镜处理，需要用到颜色矩阵，即使用Paint的setColorFilter(ColorFilter filter)

setColorFilter(int clor, Mode mode); //mode 就是 PorterDuff.Mode 指示ColorFilter如何展示，其对应的color就是src层。关于PorterDuff.Mode ，详见(/jjwwmlp456/article/details/46912561)

等方法来实现，ColorFilter的继承关系如下：

1、色彩信息的矩阵表示

四阶表示

如果想将色彩（0，255，0，255）更改为半透明时，可以使用下面的的矩阵运算来表示：

而真正的运算使用五阶矩阵

考虑下面这个变换：

1、红色分量值更改为原来的2倍；

2、绿色分量增加100；

则使用4阶矩阵的乘法无法实现，所以，应该在四阶色彩变换矩阵上增加一个“哑元坐标”，来实现所列的矩阵运算:

这个矩阵中，分量值用的是100

1*100+100

2、PorterDuffColorFilter，LightingColorFilter 和ColorMatrixColorFilter的区别：

**PorterDuffColorFilter：**以PorterDuff.mode 模式进行混合图像的颜色。

public PorterDuffColorFilter(@ColorInt int color, @NonNull PorterDuff.Mode mode)

指定一个用于混合的ARGB颜色值color，及相应的混合mode 参与构造。

LightingColorFilter：只是修改RGB值，alpha值被忽略；构造时要指定两个色值，先混合第一种颜色，再混合第二种，所以色值的顺序不一样，结果也不一定一样：

public LightingColorFilter(int mul, int add)

构造参数：mul，用于乘法；add，用于加法。关于乘法和加法运算，可以参考下面的ColorMatrix。

ColorMatrixColorFilter：通过颜色矩阵对颜色值，饱和度等进行处理。

//ColorMatrix 颜色矩阵public ColorMatrixColorFilter(ColorMatrix matrix)

以ColorMatrix为基础进行颜色变换。

ColorMatrix 颜色矩阵：

public ColorMatrix() {reset(); //重置 /* reset(): [ 1 0 0 0 0 - red vector 0 1 0 0 0 - green vector 0 0 1 0 0 - blue vector 0 0 0 1 0 ] - alpha vector */ } public ColorMatrix(float[] src) {... } public ColorMatrix(ColorMatrix src) {//基于一个ColorMatrix 进行构造 ... }

其构造方法需要一个数组，其实就是一个4x5的矩阵，用来对bitmap的颜色和alpha进行转换。形式如下：

[ a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t ]

计算规则：

R’ = a*R + b*G + c*B + d*A + e; G’ = f*R + g*G + h*B + i*A + j; B’ = k*R + l*G + m*B + n*A + o; A’ = p*R + q*G + r*B + s*A + t;

即前四列，为RGBA，用于在source的基础上进行相乘；后一列用于相加

如下，对RGB取反色，即源图像的RGB区都乘以-1再加255：

[ -1, 0, 0, 0, 255, 0, -1, 0, 0, 255, 0, 0, -1, 0, 255, 0, 0, 0, 1, 0 ]

ColorMatrix的主要方法：

set(float[] src)；设置颜色矩阵数组

set(ColorMatrix src)；设置颜色矩阵

setConcat(ColorMatrix a, ColorMatrix b；连结ab两个颜色矩阵；效果为先应用b，再应用a

setRGB2YUV()；将RGB矩阵转为YUV(与RGB类似，是一种颜色编码方案)矩阵

setYUV2RGB()；将YUV(与RGB类似，是一种颜色编码方案)矩阵转为RGB矩阵

setSaturation(float sat)；设置色彩的饱和度（百科中说：对于人的视觉，每种色彩的饱和度可分为20个可分辨等级）

setScale(float rScale, float gScale, float bScale, float aScale)；设置用于缩放(即乘法)的RGBA值，原始比例为1

setRotate(int axis, float degrees)；绕axis轴旋转degrees度；axis：0为RED，1为GREEN，2为BLUE

3、实例演示：

3.1、ColorMatrixColorFilter，修改透明度：

Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.RED);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{1, 0, 0, 0, 0,0, 1, 0, 0, 0,0, 0, 1, 0, 0,0, 0, 0, 0.5f, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setTextSize(50);canvas.drawText("通过矩阵，使用颜色滤镜实现，", 120, 700, paint);canvas.drawText("A*0.5f效果对比", 120, 550, paint);

实现效果：

颜色矩阵的缩放运算：乘法，颜色增强。

Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.RED);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{1.2f, 0, 0, 0, 0,0, 1.2f, 0, 0, 0,0, 0, 1.2f, 0, 0,0, 0, 0, 1.2f, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setTextSize(50);canvas.drawText("通过矩阵，使用颜色滤镜实现，", 120, bitmap.getHeight() + 50, paint);canvas.drawText("ARGB分别乘以1.2倍效果对比", 120, bitmap.getHeight() + 100, paint);

实现效果：

反向效果——相片的底片效果：

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{-1, 0, 0, 0, 255,0, -1, 0, 0, 255,0, 0, -1, 0, 255,0, 0, 0, 1, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("ARGB分别乘以-1然后在+255即可反向，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

黑白照片的实现：去色原理：只要把R,G,B三通道的色彩信息设置成一样，那么图像就会同时为了保证图像亮度不变，同一个通道的值满足R+G+B=1。

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{0.213f, 0.715f, 0.072f, 0, 0,0.213f, 0.715f, 0.072f, 0, 0,0.213f, 0.715f, 0.072f, 0, 0,0, 0, 0, 1, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("黑白照片的实现，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

发色效果----（红色和绿色交换）：

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{0, 1, 0, 0, 0,1, 0, 0, 0, 0,0, 0, 1, 0, 0,0, 0, 0, 1, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("发色效果，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

复古效果的实现：

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{1 / 2f, 1 / 2f, 1 / 2f, 0, 0,1 / 3f, 1 / 3f, 1 / 3f, 0, 0,1 / 4f, 1 / 4f, 1 / 4f, 0, 0,0, 0, 0, 1, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("复古效果，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

颜色通道过滤

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix(new float[]{1, 0, 0, 0, 0,0, 0, 0, 0, 0,0, 0, 0, 0, 0,0, 0, 0, 1, 0,});paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("颜色通道过滤，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

颜色增强，即高亮

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);ColorMatrix colorMatrix = new ColorMatrix();/****与ColorMatrixSub方法中的矩阵实现效果一样，ColorMatrix封装了很多方法，方便我们使用，避免了自己写矩阵* 颜色矩阵的缩放运算就是乘法运算*/colorMatrix.setScale(1.2f, 1.2f, 1.2f, 1);// colorMatrix.setSaturation(10f);//增加饱和度,就是加法运算paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("通过矩阵，使用颜色滤镜实现，反向效果", 0, bitmap.getHeight() + 50, paint);canvas.drawText("高亮，效果对比", 0, bitmap.getHeight() + 100, paint);

实现效果：

LightingColorFilter 对颜色值RGB的乘法和加法运算

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);/*** LightingColorFilter只是修改RGB值，对透明度没有影响*/paint.setColorFilter(new LightingColorFilter(0x00ff00, 0xff0000));// paint.setColorFilter(new LightingColorFilter(0xffffff, 0xff0000));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("LightingColorFilter的使用,", 0, bitmap.getHeight() + 50, paint);canvas.drawText("对颜色值RGB的乘法和加法运算", 0, bitmap.getHeight() + 100, paint);

实现效果：

PorterDuffColorFilter的使用

Paint paint = new Paint();paint.setAntiAlias(true);RectF rectF = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF, paint);/*** LightingColorFilter只是修改RGB值，对透明度没有影响*/// paint.setColorFilter(new PorterDuffColorFilter(Color.BLUE, PorterDuff.Mode.DST_IN));paint.setColorFilter(new PorterDuffColorFilter(Color.argb(255, 140, 90, 200), PorterDuff.Mode.MULTIPLY));RectF rectF2 = new RectF(600, 0, 600 + bitmap.getWidth(), bitmap.getHeight());canvas.drawBitmap(bitmap, null, rectF2, paint);paint.setColorFilter(null);paint.setTextSize(45);paint.setColor(Color.RED);canvas.drawText("PorterDuffColorFilter的使用,", 0, bitmap.getHeight() + 50, paint);canvas.drawText("对颜色的混合叠加效果实现", 0, bitmap.getHeight() + 100, paint);

实现效果：

Demo源码见：

/meiSThub/DN_Homework/blob/master/app/src/main/java/com/mei/test/ui/filter/widget/FilterView.java

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。