自定义View-第十八步：ColorMatrix

作者: crossroads | 来源:发表于2017-02-24 12:18 被阅读99次

前言

根据启舰大大的博客所学习的自定义View。

ColorMatrix

色彩矩阵

注意：对于色彩变换矩阵，这里的色彩顺序是R、G、B、A而不是A、R、G、B！！！

但是，ColorMatrix是五阶矩阵，WHY？

使用四阶的色彩变换矩阵来修改色彩，只能够对色彩的每一个分量值进行乘（除）运算，如果要对这些分量值进行加减法的运算（平移变换），只能通过五阶矩阵来完成。
考虑下面这个变换：
1、红色分量值更改为原来的2倍；
2、绿色分量增加100；
则使用4阶矩阵的乘法无法实现，所以，应该在四阶色彩变换矩阵上增加一个“哑元坐标”，来实现所列的矩阵运算:

如果想不通，手动算一下就OK啦
添加一下矩阵运算的回顾，嘿嘿

A矩阵的列数必须与B矩阵的行数相同，才能相乘！因为我们需要把A中的一行中的各个数字与B矩阵中的一列中的各个数字分别相乘，所以A的列数与B的行数必须相同才行！
矩阵A乘以矩阵B和矩阵B乘以矩阵A的结果必然是不一样的。

ColorMatrics示例

//构造函数
ColorMatrix()  
ColorMatrix(float[] src)  
ColorMatrix(ColorMatrix src)  //利用另一个ColorMatrix实例来复制一个一样的ColorMatrix对象
//设置重置函数
public void set(ColorMatrix src)  
public void set(float[] src)  
public void reset() 
//返回当前ColorMatrics对象中的所保存的矩阵
public float[] getArray()

1. 蓝色通道输出

      paint.setColorFilter(null);
        //原图
        canvas.drawBitmap(bitmap,null,new RectF(0,0,bitmap.getWidth(),bitmap.getHeight()),paint);
        canvas.translate(bitmap.getWidth()+100,0);
        //色彩矩阵，切记是RGBA
        ColorMatrix colorMatrix = new ColorMatrix(new float[]{
                0,0,0,0,0,
                0,0,0,0,0,
                0,0,1,0,0,
                0,0,0,1,0,
        });
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        //蓝色通道输出
        canvas.drawBitmap(bitmap,null,new RectF(0,0,bitmap.getWidth(),bitmap.getHeight()),paint);

蓝色通道效果图

2. 在色彩变换矩阵的最后一行加上某个值，增加特定色彩的饱和度

 ColorMatrix colorMatrix = new ColorMatrix(new float[]{
                1,0,0,0,0,
                0,1,0,0,50,
                0,0,1,0,0,
                0,0,0,1,0,
        });

效果图
3. 色彩反转/反相功能：色彩反转就是求出每个色彩的补值来做为目标图像的对应颜色值

 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,
        });

4. 色彩缩放变换：在色彩矩阵对角线上的分别代表R、G、B、A的几个值，将其分别乘以指定的值

  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,
        });

4. 色彩的投射运算

灰白照片

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,  
});

效果图

这个值是google最终给我们的颜色值。

照片变旧

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  
});

来自http://blog.csdn.net/harvic880925/article/details/51187277

下面开始，就是使用各种方法啦

5. setSaturation——设置饱和度

//整体增强颜色饱和度，即同时增强R,G,B的色彩饱和度  
public void setSaturation(float sat)

float sat：表示把当前色彩饱和度放大的倍数;取值为0表示完全无色彩，即灰度图像（黑白图像）；取值为1时，表示色彩不变动；当取值大于1时，显示色彩过度饱和
直接上代码⤵️

    <ImageView
        android:layout_centerInParent="true"
        android:id="@+id/img"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:scaleType="centerCrop"
        />
    <SeekBar
        android:layout_marginTop="10dp"
        android:layout_below="@id/img"
        android:id="@+id/seekbar"
        android:layout_width="match_parent"
        android:layout_height="30dp"/>

     SeekBar seek = (SeekBar) findViewById(R.id.seekbar);
        final ImageView img = (ImageView) findViewById(R.id.img);
        seek.setMax(20);
        seek.setProgress(1);

        mOriginBmp = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_launcher);
        mTempBmp = Bitmap.createBitmap(mOriginBmp.getWidth(), mOriginBmp.getHeight(), Bitmap.Config.ARGB_8888);

        seek.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                handleColorMatriBmp(progress);
                img.setImageBitmap(mTempBmp);
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });
    }

    private void handleColorMatriBmp(int progress) {
        Canvas canvas = new Canvas(mTempBmp);//得到画笔对象，用于绘制调色后的图片
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        ColorMatrix colorMatrix = new ColorMatrix();
        colorMatrix.setSaturation(progress);
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        canvas.drawBitmap(mOriginBmp, 0, 0, paint);
    }

效果图

**6. setScale——色彩缩放 **

public void setScale(float rScale, float gScale, float bScale,float aScale)  //分别对应R,G,B,A颜色值的缩放倍数

     Canvas canvas = new Canvas(mTempBmp);//得到画笔对象，用于绘制调色后的图片
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        ColorMatrix colorMatrix = new ColorMatrix();
        colorMatrix.setScale(1,1.3f,1,1);//将绿色放大1.3倍
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        canvas.drawBitmap(mOriginBmp, 0, 0, paint);

效果图
7. setRotate——色彩旋转

/** 
 * 将旋转围绕某一个颜色轴旋转 
 * axis=0 围绕红色轴旋转 
 * axis=1 围绕绿色轴旋转 
 * axis=2 围绕蓝色轴旋转 
 */  
public void setRotate(int axis, float degrees)；

int axis：表示围绕哪个轴旋转，取值为0，1，2；取0时表示围绕红色轴旋转；取值1时，表示围绕绿色轴旋转；取值2时，表示围绕蓝色轴旋转；
float degrees：表示旋转的度数

举个栗子

    seek.setMax(360);
        seek.setProgress(180);

        mOriginBmp = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_launcher);
        mTempBmp = Bitmap.createBitmap(mOriginBmp.getWidth(), mOriginBmp.getHeight(), Bitmap.Config.ARGB_8888);

        seek.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                handleColorMatriBmp(progress);
                img.setImageBitmap(mTempBmp);
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });
    }

    private void handleColorMatriBmp(int progress) {
        Canvas canvas = new Canvas(mTempBmp);//得到画笔对象，用于绘制调色后的图片
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        ColorMatrix colorMatrix = new ColorMatrix();
        colorMatrix.setRotate(2,progress-180);//围绕蓝色轴旋转，度数是-180度 ~ +180度
        paint.setColorFilter(new ColorMatrixColorFilter(colorMatrix));
        canvas.drawBitmap(mOriginBmp, 0, 0, paint);
    }