自定义View之RGB颜色变化Paint画笔颜色过滤器setColorFilter，LightingColorFilter光照过滤器

首先看一下效果：

通过来给RGB改变不同的值，图片出现不同的变化，其中负值代表削弱相应的颜色，正值代表加强相应的颜色。下面给出主要步骤，下边会贴源码

主要步骤：

1.创建一个类继承自View，重写onDraw方法

2.创建画笔

3.下面给画笔创建着色器：

什么是着色器，在通常情况下，我们会给画笔设置颜色setColor，现在我们不想给画笔设置单一的颜色，想设置更炫酷的效果，那么就用到Paint.setShader方法，

setShader的第二个参数是模式，我们这里使用镜面模式（还有另外两种模式），当然shader的种类很多，我们这里用到BitmapShader，顾名思义是用一个Bitmao设置Paint代码如下:

/**         * 初始化画笔，抗锯齿         */        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);        /**         * 创建bitmap对象         */        Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.nbaba);        /**         *为画笔设置着色器         */        mPaint.setShader(new BitmapShader(bitmap, Shader.TileMode.MIRROR, Shader.TileMode.MIRROR));

4.根据seekBar的变化给画笔paint设置颜色过滤器，不同的过滤器渲染了不同的颜色效果核心代码如下：

/**     * 过滤器对象     */    private LightingColorFilter lightingColorFilter;mPaint.setColorFilter(lightingColorFilter);

那么创建LightingColorFilter的参数是什么呢？我们不妨看一下源码的解释：

/**     * 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;    }

大致意思如下：创建一个颜色过滤器，乘以一个颜色，加上一个颜色，参数的透明度被忽略。怎么理解，第一个参数mul决定相应颜色被削弱的程度，第二个函数add决定了相应颜色的加深程度，如果乘以0x00ffff，那么红色被完全削弱，加上0xff0000那么红色被加强最深。

下面是完整代码：

MainActivity.java

package com.example.zqd.rgbchanged;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.widget.SeekBar;import android.widget.TextView;public class MainActivity extends AppCompatActivity implements SeekBar.OnSeekBarChangeListener {    private SeekBar sb_r;    private SeekBar sb_g;    private SeekBar sb_b;    private TextView tv_r;    private TextView tv_g;    private TextView tv_b;    private PictureView pv;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();        sb_r.setOnSeekBarChangeListener(this);        sb_g.setOnSeekBarChangeListener(this);        sb_b.setOnSeekBarChangeListener(this);    }    private void initView() {        pv = (PictureView) findViewById(R.id.pv);        sb_r = (SeekBar) findViewById(R.id.sb_r);        sb_g = (SeekBar) findViewById(R.id.sb_g);        sb_b = (SeekBar) findViewById(R.id.sb_b);        tv_r = (TextView) findViewById(R.id.tv_r);        tv_g = (TextView) findViewById(R.id.tv_g);        tv_b = (TextView) findViewById(R.id.tv_b);        sb_r.setMax(510);        sb_g.setMax(510);        sb_b.setMax(510);        sb_r.setProgress(255);        sb_g.setProgress(255);        sb_b.setProgress(255);    }    @Override    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {        pv.changeRGB(sb_r.getProgress() - 255, sb_g.getProgress() - 255, sb_b.getProgress() - 255);        switch (seekBar.getId()) {            case R.id.sb_r:                tv_r.setText(progress - 255 + "");                break;            case R.id.sb_g:                tv_g.setText(progress - 255 + "");                break;            case R.id.sb_b:                tv_b.setText(progress - 255 + "");                break;        }    }    @Override    public void onStartTrackingTouch(SeekBar seekBar) {    }    @Override    public void onStopTrackingTouch(SeekBar seekBar) {    }}

PictureView.java

package com.example.zqd.rgbchanged;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.LightingColorFilter;import android.graphics.Paint;import android.graphics.Shader;import android.util.AttributeSet;import android.view.View;/** * Created by zqd on 2017/10/27. */public class PictureView extends View {    /**     * 画笔     */    private Paint mPaint;    /**     * 屏幕宽度     */    private int w;    /**     * 屏幕高度     */    private int h;    /**     * 过滤器对象     */    private LightingColorFilter lightingColorFilter;    public PictureView(Context context) {        super(context);        init();    }    public PictureView(Context context, AttributeSet attrs) {        super(context, attrs);        init();    }    public PictureView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        init();    }    @Override    protected void onSizeChanged(int w, int h, int oldw, int oldh) {        super.onSizeChanged(w, h, oldw, oldh);        /**         * 得到宽高         */        this.w = w;        this.h = h;    }    private void init() {        /**         * 初始化画笔，抗锯齿         */        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);        /**         * 创建bitmap对象         */        Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.nbaba);        /**         *为画笔设置着色器         */        mPaint.setShader(new BitmapShader(bitmap, Shader.TileMode.MIRROR, Shader.TileMode.MIRROR));    }    @Override    protected void onDraw(Canvas canvas) {        /**         * 平移画布至屏幕中心点         */        canvas.translate(w / 2, h / 2);        /**         * 画圆         */        canvas.drawCircle(0, 0, 200, mPaint);        super.onDraw(canvas);    }    /**     * 获取RGB值     *     * @param r     * @param g     * @param b     */    public void changeRGB(int r, int g, int b) {        int mr = 0;        int mg = 0;        int mb = 0;        int ar = 0;        int ag = 0;        int ab = 0;        if (r < 0) {            mr = r + 255;            ar = 0;        } else if (r == 0) {            mr = 255;            ar = 0;        } else {            mr = 255;            ar = r;        }        if (g < 0) {            mg = g + 255;            ag = 0;        } else if (g == 0) {            mg = 255;            ag = 0;        } else {            mg = 255;            ag = g;        }        if (b < 0) {            mb = b + 255;            ab = 0;        } else if (b == 0) {            mb = 255;            ab = 0;        } else {            mb = 255;            ab = b;        }        lightingColorFilter = new LightingColorFilter(Integer.valueOf(transString(Integer.toHexString(mr)) + transString(Integer.toHexString(mg)) + transString(Integer.toHexString(mb)), 16),                Integer.valueOf(transString(Integer.toHexString(ar)) + transString(Integer.toHexString(ag)) + transString(Integer.toHexString(ab)), 16));        mPaint.setColorFilter(lightingColorFilter);        invalidate();    }    /**     * 处理RGB     *     * @param s     * @return     */    public String transString(String s) {        if (s.length() == 1) {            return "0" + s;        } else {            return s;        }    }}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.example.zqd.rgbchanged.MainActivity">    <com.example.zqd.rgbchanged.PictureView        android:id="@+id/pv"        android:layout_width="match_parent"        android:layout_height="300dp" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical">        <LinearLayout            android:layout_width="match_parent"            android:layout_height="0dp"            android:layout_weight="1"            android:gravity="center_vertical"            android:orientation="horizontal"            android:paddingRight="10dp">            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="10dp"                android:layout_marginRight="10dp"                android:text="R"                android:textSize="18sp" />            <SeekBar                android:id="@+id/sb_r"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="8" />            <TextView                android:id="@+id/tv_r"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center" />        </LinearLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="0dp"            android:layout_weight="1"            android:gravity="center_vertical"            android:orientation="horizontal"            android:paddingRight="10dp">            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="10dp"                android:layout_marginRight="10dp"                android:text="G"                android:textSize="18sp" />            <SeekBar                android:id="@+id/sb_g"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="8" />            <TextView                android:id="@+id/tv_g"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center" />        </LinearLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="0dp"            android:layout_weight="1"            android:gravity="center_vertical"            android:orientation="horizontal"            android:paddingRight="10dp">            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="10dp"                android:layout_marginRight="10dp"                android:text="B"                android:textSize="18sp" />            <SeekBar                android:id="@+id/sb_b"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="8" />            <TextView                android:id="@+id/tv_b"                android:layout_width="0dp"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center" />        </LinearLayout>    </LinearLayout></LinearLayout>