Android圖片處理ColorMatrix

首先聲明，該文章為自己學習筆記，僅供參考，不保證所有文字均描述得當，歡迎指出不足和錯誤之處，再此感謝您的關注和閱讀。如果有需要代碼的可以留言，和我聯絡。

0 前面的廢話

前幾天做一個Image Recognition的時候，用到了ColorMatrix，然後找到了一篇文章，寫的很不錯，確實按照他的方法實現了。原文沒有給xml，所以很是費了些時間，然後我又改進了一些，前面的描述都是原文的描述，寫的很好，後面代碼是自己的。

參考文章：Android圖片處理（Matrix,ColorMatrix）http://www.cnblogs.com/leon19870907/articles/1978065.html

一.ColorMatrix的原理

        在編程中有時候需要對圖片做特殊的處理，比如將圖片做出黑白的，或者老照片的效果，有時候還要對圖片進行變換，以展開，扭曲等等。這些效果在android中有很好的支援，通過顏色矩陣（ColorMatrix）和座標變換矩陣（Matrix）可以完美的做出上面的所說的效果。下面將分別介紹這兩個矩陣的用法和相關的函數。

顏色矩陣
android中可以通過顏色矩陣（ColorMatrix類）方面的操作顏色，顏色矩陣是一個5x4 的矩陣

可以用來方面的修改圖片中RGBA各分量的值，顏色矩陣以一維數組的方式儲存如下：
 [ a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t ]
他通過RGBA四個通道來直接操作對應顏色，如果會使用Photoshop就會知道有時處理圖片通過控制RGBA各色彩通道來做出特殊的效果。

矩陣的運算規則是矩陣A的一行乘以矩陣C的一列作為矩陣R的一行，

C矩陣是圖片中包含的ARGB資訊，R矩陣是用顏色矩陣應用於C之後的新的顏色分量，運算結果如下：
 
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;
 
顏色矩陣並不是看上去那麼深奧，其實需要使用的參數很少，而且很有規律第一行決定紅色第二行決定綠色

第三行決定藍色，第四行決定了透明度，第五列是顏色的位移量。下面是一個實際中使用的顏色矩陣。

如果把這個矩陣作用於各顏色分量的話，R=A*C，計算後會發現，各個顏色分量實際上沒有任何的改變(R'=R G'=G B'=B A'=A)。

圖1.5所示矩陣計算後會發現紅色分量增加100，綠色分量增加100，

這樣的效果就是圖片偏黃，因為紅色和綠色混合後得到黃色，黃色增加了100，圖片當然就偏黃了。

改變各顏色分量不僅可以通過修改第5列的顏色位移量也可如上面矩陣所示將對應的顏色值乘以一個倍數，直接放大。

1.6是將綠色分量乘以2變為原來的2倍。相信讀者至此已經明白了如何通過顏色矩陣來改變各顏色分量。

下面編寫一段代碼來，通過調整顏色矩陣來獲得不同的顏色效果。

二 代碼實現

首先，寫一個MyImage.java，這個主要是寫了一個自訂的View。為後面的View服務

package com.example.android.apis.view.colormatrix;import com.example.android.apis.R;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Canvas;import android.graphics.ColorMatrix;import android.graphics.ColorMatrixColorFilter;import android.graphics.Paint;import android.util.AttributeSet;import android.util.Log;import android.view.View;public class MyImage extends View {      private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);      private Bitmap mBitmap;      private float [] array=new float[20];             public MyImage(Context context,AttributeSet attrs) {          super(context,attrs);            //mBitmap    = BitmapFactory.decodeResource(context.getResources(),R.drawable.ic_launcher);        String dir = android.os.Environment.getExternalStorageDirectory()+"/1317835083240.jpg";        mBitmap=BitmapFactory.decodeFile(dir);        Log.i("1",android.os.Environment.getExternalStorageDirectory()+" ");        //mBitmap=BitmapFactory.decodeResource(context.getResources(), R.drawable.icon);        invalidate();      }                 public void setValues(float [] a){          for(int i=0;i<20;i++){             array[i]=a[i];          }                }            @Override     protected void onDraw(Canvas canvas) {          Paint paint = mPaint;            paint.setColorFilter(null);          canvas.drawBitmap(mBitmap, 0, 0, paint);                    ColorMatrix cm = new ColorMatrix();         //設定顏色矩陣          cm.set(array);  //顏色濾鏡，將顏色矩陣應用於圖片          paint.setColorFilter(new ColorMatrixColorFilter(cm));  //繪圖          canvas.drawBitmap(mBitmap, 0, 0, paint);          Log.i("CMatrix", "--------->onDraw");                  }       }

CMatrix.java

package com.example.android.apis.view.colormatrix;import com.example.android.apis.R;import android.app.Activity;import android.os.Bundle;import android.util.Log;import android.view.View;import android.widget.Button;import android.widget.EditText;public class CMatrix extends Activity {          private Button change,change1,change2,change3;      private EditText [] et=new EditText[20];      private float []carray=new float[20];      private MyImage sv;      @Override      public void onCreate(Bundle savedInstanceState) {          super.onCreate(savedInstanceState);          setContentView(R.layout.imgmain);                   change=(Button)findViewById(R.id.set);       change1=(Button)findViewById(R.id.set1);       change2=(Button)findViewById(R.id.set2);       change3=(Button)findViewById(R.id.set3);       sv=(MyImage)findViewById(R.id.MyImage);               for(int i=0;i<20;i++){                     et[i]=(EditText)findViewById(R.id.indexa+i);         carray[i]=Float.valueOf(et[i].getText().toString());        Log.i("et["+i+"]",et[i].getText().toString());       }                   change.setOnClickListener(l);       change1.setOnClickListener(l1);        change2.setOnClickListener(l2);        change3.setOnClickListener(l3);     }            private Button.OnClickListener l=new Button.OnClickListener(){            @Override         public void onClick(View arg0) {             // TODO Auto-generated method stub             getValues();           sv.setValues(carray);             sv.invalidate();         }                };    private Button.OnClickListener l1=new Button.OnClickListener(){                 @Override          public void onClick(View arg0) {              // TODO Auto-generated method stub              getValue1();            setValue();            sv.setValues(carray);              sv.invalidate();          }                  };     private Button.OnClickListener l2=new Button.OnClickListener(){                  @Override           public void onClick(View arg0) {               // TODO Auto-generated method stub           Log.i("自由","點擊");             getValue2();             setValue();             sv.setValues(carray);               sv.invalidate();           }                    };      private Button.OnClickListener l3=new Button.OnClickListener(){                   @Override            public void onClick(View arg0) {                // TODO Auto-generated method stub                getValue3();              setValue();              sv.setValues(carray);                sv.invalidate();            }                      };        public   void getValues(){          for(int i=0;i<20;i++){                            carray[i]=Float.valueOf(et[i].getText().toString());            Log.i("1", carray[i]+"");        }                }      public   void getValue1(){      //高飽和度                carray[0]=5;                carray[1]=0;                carray[2]=0;                carray[3]=0;                carray[4]=-254;                carray[5]=0;                carray[6]=5;                carray[7]=0;                carray[8]=0;                carray[9]=-254;                carray[10]=0;                carray[11]=0;                carray[12]=5;                carray[13]=0;                carray[14]=-254;                carray[15]=0;                carray[16]=0;                carray[17]=0;                carray[18]=5;                carray[19]=-254;              }     public   void getValue2(){      //色相變化        carray[0]=(float) -0.36;        carray[1]=(float) 1.691;        carray[2]=(float) -0.32;        carray[3]=0;        carray[4]=0;        carray[5]=(float) 0.325;        carray[6]=(float) 0.398;        carray[7]=(float) 0.275;        carray[8]=0;        carray[9]=0;        carray[10]=(float) 0.79;        carray[11]=(float) 0.79;        carray[12]=(float) -0.76;        carray[13]=0;        carray[14]=0;        carray[15]=0;        carray[16]=0;        carray[17]=0;        carray[18]=1;        carray[19]=0;              }     public   void getValue3(){            //黑白        carray[0]=(float) 0.308;        carray[1]=(float) 0.609;        carray[2]=(float) 0.082;        carray[3]=0;        carray[4]=0;        carray[5]=(float) 0.308;        carray[6]=(float) 0.609;        carray[7]=(float) 0.082;        carray[8]=0;        carray[9]=0;        carray[10]=(float) 0.308;        carray[11]=(float) 0.609;        carray[12]=(float) 0.082;        carray[13]=0;        carray[14]=0;        carray[15]=0;        carray[16]=0;        carray[17]=0;        carray[18]=1;        carray[19]=0;    }     public   void setValue(){        for(int i=0;i<20;i++){                       et[i]=(EditText)findViewById(R.id.indexa+i);        et[i].setText(carray[i]+"");        carray[i]=Float.valueOf(et[i].getText().toString());         Log.i("et["+i+"]",et[i].getText().toString());        }      }      }  

xml檔案

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <TextView android:textSize="15.0sp"         android:textStyle="bold"         android:textColor="#ffffffff"         android:padding="2.0sp"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginLeft="2.0sp"         android:text="紅色(R)"         />         <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" >                                   <requestFocus />        </EditText>        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa1"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa2"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa3"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa4"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >                <TextView android:textSize="15.0sp"         android:textStyle="bold"         android:textColor="#ffffffff"         android:padding="2.0sp"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginLeft="2.0sp"         android:text="綠色(G)"         />         <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa5"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" >        </EditText>        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa6"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa7"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa8"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa9"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />    </LinearLayout>    <LinearLayout    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="horizontal" >        <TextView android:textSize="15.0sp"         android:textStyle="bold"         android:textColor="#ffffffff"         android:padding="2.0sp"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginLeft="2.0sp"         android:text="藍色(B)"         />    <EditText        android:text="0"        android:textSize="10dip"        android:id="@+id/indexa10"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_weight="1" >    </EditText>    <EditText        android:text="0"        android:textSize="10dip"        android:id="@+id/indexa11"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_weight="1" />    <EditText        android:text="0"        android:textSize="10dip"        android:id="@+id/indexa12"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_weight="1" />    <EditText        android:text="0"        android:textSize="10dip"        android:id="@+id/indexa13"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_weight="1" />    <EditText        android:text="0"        android:textSize="10dip"        android:id="@+id/indexa14"        android:layout_width="60dp"        android:layout_height="40dp"        android:layout_weight="1" /></LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <TextView android:textSize="15.0sp"         android:textStyle="bold"         android:textColor="#ffffffff"         android:padding="2.0sp"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginLeft="2.0sp"         android:text="透明(A)"         />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa15"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" >        </EditText>        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa16"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa17"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa18"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />        <EditText            android:text="0"            android:textSize="10dip"            android:id="@+id/indexa19"            android:layout_width="60dp"            android:layout_height="40dp"            android:layout_weight="1" />    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >    <Button        android:id="@+id/set"        android:layout_width="60dp"        android:layout_height="40dp"        android:text="自由" />    <Button        android:id="@+id/set1"        android:layout_width="60dp"        android:layout_height="40dp"        android:text="多彩" />    <Button        android:id="@+id/set2"        android:layout_width="60dp"        android:layout_height="40dp"        android:text="色相" />    <Button        android:id="@+id/set3"        android:layout_width="60dp"        android:layout_height="40dp"        android:text="黑白" />    </LinearLayout>    <com.example.android.apis.view.colormatrix.MyImage        android:id="@+id/MyImage"        android:layout_width="wrap_content"        android:layout_height="wrap_content" /></LinearLayout>

三，效果示範