SeniorUI06_Paint实现滤镜效果

高级UI汇总​​​​​​​
Android中颜色值用32位的int值表示，ARGB ：A—Alpha值，RGB—颜色值
色彩由四阶矩阵表示：

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

但是遇到下面的颜色变换需求：

• 1、红色分量值更改为原来的2倍；
• 2、绿色分量增加100；
  则使用4阶矩阵的乘法无法实现，这个时候就需要使用五阶矩阵进行运算，在四阶色彩变换矩阵上增加一个“哑元坐标”，来实现所列的矩阵运算：
  

##2 Paint实现滤镜效果
滤镜效果：对图像进行一定的过滤处理
分类：Alpha滤镜处理 和 颜色RGB的滤镜处理

##3 Alpha滤镜处理
对应api： public MaskFilter setMaskFilter(MaskFilter maskfilter)

1. BlurMaskFilter–用来绘制模糊阴影

API：

/**
 * radius 阴影的半径
 * style  风格
 *  SOLID：图像边界外产生一层与Paint颜色一致阴影效果，不影响图像的本身
 *  OUTER：图像边界外产生一层阴影，并且将图像变成透明效果
 *  INNER：在图像内部边沿产生模糊效果
 */
 paint.setMaskFilter(new BlurMaskFilter(radius, style));	 

2. EmbossMaskFilter – 用来实现浮雕效果

/**
 *  direction  指定光源的位置，长度为xxx的数组标量[x,y,z]
 *  ambient    环境光的因子 （0~1），越接近0，环境光越暗
 *  specular   镜面反射系数 越接近0，镜面反射越强
 *  blurRadius 模糊半径 值越大，模糊效果越明显
 *  paint.setMaskFilter(new EmbossMaskFilter(direction,ambient,specular,blurRadius)
 */

代码：MaskFilterView

##4 颜色RGB的滤镜处理

1. 色彩的平移运算—加法运算
   在最后一列加上某个值，这样就可以增加特定色彩的饱和度
   色彩的反转/反相；增加饱和度

2. 色彩的缩放运算–乘法运算
   高亮图片
   颜色通道过滤（单独红色、绿色、蓝色）

3. 色彩的投射运算
   黑白照片
   色彩反色（两个颜色交换）
   复古照片
   
   

   //颜色通道过滤
    private void filter(Canvas canvas) {
        canvas.translate(bitmap.getWidth() + 50,0);
        canvas.drawText("颜色通道过滤（只留红色）:", 30, 50, 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));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }
    //复古效果
    private void vintage(Canvas canvas) {
        canvas.translate(-bitmap.getWidth() - 50, bitmap.getHeight() + 60);
        canvas.drawText("复古效果:", 30, 50, 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));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

    //发色效果---（比如红色和绿色交换）
    private void colour(Canvas canvas){
        canvas.translate(bitmap.getWidth() + 50,0);
        canvas.drawText("发色效果（比如红色和绿色交换）:", 30, 50, 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));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

    // 黑白照片
    // 去色原理：只要把R G B 三通道的色彩信息设置成一样，那么图像就会变成灰色，
    // 同时为了保证图像亮度不变，同一个通道里的R+G+B =1
    private void blackWhite(Canvas canvas) {
        canvas.translate(-bitmap.getWidth() - 50, bitmap.getHeight() + 60);
        canvas.drawText("黑白照片:", 30, 50, 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));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

    //缩放运算---乘法 -- 颜色增强
    private void scale(Canvas canvas) {
        canvas.translate(bitmap.getWidth() + 50, 0);
        canvas.drawText("缩放运算---乘法 -- 颜色增强", 30, 50, 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, 0
        });
      //或者
        //  ColorMatrix colorMartrix = new ColorMatrix();
        // colorMartrix.setScale(1.2f,1.2f,1.2f,1);
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

    // 反相效果 -- 底片效果
    private void opposition(Canvas canvas) {
        canvas.translate(-bitmap.getWidth() - 50, bitmap.getHeight() + 60);
        canvas.drawText("反相效果 -- 底片效果", 30, 50, 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));

        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

    //平移运算：红色加100
    private void translate(Canvas canvas) {
        canvas.translate(bitmap.getWidth() + 50, 0);
        canvas.drawText("平移运算：红色加100", 20, 50, paint);
        ColorMatrix colorMatrix = new ColorMatrix(new float[]{
                1, 0, 0, 0, 0,
                0, 1, 0, 0, 100,
                0, 0, 1, 0, 0,
                0, 0, 0, 255, 0
        });
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        canvas.drawBitmap(bitmap, 20, 60, paint);
    }

4 . 色彩的单独加亮

/**
     * Create a colorfilter that multiplies the RGB channels by one color,
     * and then adds a second color. The alpha components of the mul and add
     * arguments are ignored.
     */
    public LightingColorFilter(@ColorInt int mul, @ColorInt int add) {
        mMul = mul;
        mAdd = add;
    }

paint.setColorFilter(new LightingColorFilter(0x00ff00,0xff0000))；

6. 色彩旋转运算
   

ColorMatrix colorMartrix = new ColorMatrix();
//colorMartrix.setSaturation(progress);
  //aixs-- 0 红色轴，1，绿色，2，蓝色
 // degrees -- 旋转的角度
  colorMartrix.setRotate(0,progress);

colorMartrix.setConcat合并两个ColorMatrix

##5 透明度和色值运算混合实现
PortDuffColorFilter

##6 Demo
SeniorUI06_FilterActivity