• Android学习笔记之图像颜色处理（ColorMatrix）

    对图像进行颜色方面的处理，通过使用颜色矩阵（ColorMatrix）来实现。从而可以达到很多特效如黑白老照片、泛黄旧照片等等。

    1.颜色矩阵(ColorMatrix)

    这里有详细的介绍：http://developer.Android.com/reference/android/graphics/ColorMatrix.html

    不过是英文的，在这里我就先导读一下。

    一张位图可以转换为一个5*4的矩阵，涉及到颜色和透明度。如图1所示。在Android中，颜色矩阵M是以一维数组m=[a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t]的方式进行存储的。

       

                          图1

    在一张图片中，图像的RGBA（红色、绿色、蓝色、透明度）值决定了该图片所呈现出来的颜色效果。
    而图像的RGBA值则存储在一个5*1的颜色分量矩阵C中，由颜色分量矩阵C可以控制图像的颜色效果。颜色分量矩阵C如图2所示。

             

                    图2

    要想改变一张图片的颜色效果，只需要改变图像的颜色分量矩阵即可。通过颜色矩阵可以很方便的修改图像的颜色分量矩阵。假设修改后的图像颜色分量矩阵为C1，则有如图3所示的颜色分量矩阵计算公式。


                                                                 图3

    由此可见，通过颜色矩阵修改了原图像的RGBA值，从而达到了改变图片颜色效果的目的。并且，通过如图3所示的运算可知，颜色矩阵M的第一行参数abcde决定了图像的红色成分，第二行参数fghij决定了图像的绿色成分，第三行参数klmno决定了图像的蓝色成分，第四行参数pqrst决定了图像的透明度，第五列参数ejot是颜色的偏移量。
    通常，改变颜色分量时可以通过修改第5列的颜色偏移量来实现，如图4所示的颜色矩阵M1，通过计算后可以得知该颜色矩阵的作用是使图像的红色分量和绿色分量均增加100，这样的效果就是图片泛黄（因为红色与绿色混合后得到黄色）。


                      图4

    除此之外，也可以通过直接对颜色值乘以某一系数而达到改变颜色分量的目的。如图5所示的颜色矩阵M2，将绿色分量放大了2倍，这样的效果就是图片泛绿色。


                     图5

    实例：

    步骤一：我们首先自定义一个view，用来显示我们处理的图片。

    ColorView.Java

    [java] view plain copy
    1. package com.mycolor;  
    2.   
    3. import android.content.Context;  
    4. import android.graphics.Bitmap;  
    5. import android.graphics.BitmapFactory;  
    6. import android.graphics.Canvas;  
    7. import android.graphics.ColorMatrix;  
    8. import android.graphics.ColorMatrixColorFilter;  
    9. import android.graphics.Paint;  
    10. import android.util.AttributeSet;  
    11. import android.widget.ImageView;  
    12.   
    13. public class ColorView extends ImageView {  
    14.   
    15.     private Paint myPaint = null;  
    16.     private Bitmap bitmap = null;  
    17.     private ColorMatrix myColorMatrix = null;  
    18.     private float[] colorArray = {1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0};  
    19.       
    20.     public ColorView(Context context, AttributeSet attrs)  
    21.     {  
    22.         super(context, attrs);  
    23.         bitmap = BitmapFactory.decodeResource(context.getResources(),R.drawable.a2);   
    24.         invalidate();   
    25.     }  
    26.     @Override  
    27.     protected void onDraw(Canvas canvas) {  
    28.         super.onDraw(canvas);  
    29.         //新建画笔对象  
    30.         myPaint = new Paint();     
    31.         //描画（原始图片）      
    32.         canvas.drawBitmap(bitmap,0, 0, myPaint);        
    33.         //新建颜色矩阵对象      
    34.         myColorMatrix = new ColorMatrix();     
    35.         //设置颜色矩阵的值  
    36.         myColorMatrix.set(colorArray);             
    37.         //设置画笔颜色过滤器      
    38.         myPaint.setColorFilter(new ColorMatrixColorFilter(myColorMatrix));     
    39.          //描画（处理后的图片）  
    40.         canvas.drawBitmap(bitmap,0,0,myPaint);  
    41.         invalidate();   
    42.     }  
    43.     //设置颜色数值  
    44.     public void setColorArray(float[] colorArray){  
    45.         this.colorArray = colorArray;  
    46.     }  
    47.     //设置图片  
    48.     public void setBitmap(Bitmap bitmap){  
    49.         this.bitmap = bitmap;  
    50.     }  
    51. }  


    步骤二：自定义我们的布局

    main.xml

    [html] view plain copy
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:id="@+id/colorView_layout"  
    4.     android:layout_width="fill_parent"  
    5.     android:layout_height="fill_parent"  
    6.     android:orientation="vertical" >  
    7.   
    8.     <com.mycolor.ColorView  
    9.         android:id="@+id/myColorView"  
    10.         android:layout_width="480dp"  
    11.         android:layout_height="180dp"/>  
    12.     <LinearLayout  
    13.         android:id="@+id/colorlayout1"  
    14.         android:layout_width="fill_parent"  
    15.         android:layout_height="wrap_content"  
    16.         android:orientation="horizontal" >  
    17.   
    18.         <EditText  
    19.             android:id="@+id/Edit1"  
    20.             android:layout_width="50dp"  
    21.             android:layout_height="40dp"  
    22.             android:layout_weight="1"  
    23.             android:text="1" />  
    24.   
    25.         <EditText  
    26.             android:id="@+id/Edit2"  
    27.             android:layout_width="50dp"  
    28.             android:layout_height="40dp"  
    29.             android:layout_weight="1"  
    30.             android:text="0"   
    31.             />  
    32.   
    33.         <EditText  
    34.             android:id="@+id/Edit3"  
    35.             android:layout_width="50dp"  
    36.             android:layout_height="40dp"  
    37.             android:layout_weight="1"  
    38.             android:text="0" />  
    39.   
    40.         <EditText  
    41.             android:id="@+id/Edit4"  
    42.             android:layout_width="50dp"  
    43.             android:layout_height="40dp"  
    44.             android:layout_weight="1"  
    45.             android:text="0" />  
    46.   
    47.         <EditText  
    48.             android:id="@+id/Edit5"  
    49.             android:layout_width="50dp"  
    50.             android:layout_height="40dp"  
    51.             android:layout_weight="1"  
    52.             android:text="0" />  
    53.     </LinearLayout>  
    54.   
    55.     <LinearLayout  
    56.         android:id="@+id/colorlayout2"  
    57.         android:layout_width="fill_parent"  
    58.         android:layout_height="wrap_content"  
    59.         android:orientation="horizontal" >  
    60.   
    61.         <EditText  
    62.             android:id="@+id/Edit6"  
    63.             android:layout_width="50dp"  
    64.             android:layout_height="40dp"  
    65.             android:layout_weight="1"  
    66.             android:text="0" />  
    67.   
    68.         <EditText  
    69.             android:id="@+id/Edit7"  
    70.             android:layout_width="50dp"  
    71.             android:layout_height="40dp"  
    72.             android:layout_weight="1"  
    73.             android:text="1" />  
    74.   
    75.         <EditText  
    76.             android:id="@+id/Edit8"  
    77.             android:layout_width="50dp"  
    78.             android:layout_height="40dp"  
    79.             android:layout_weight="1"  
    80.             android:text="0" />  
    81.   
    82.         <EditText  
    83.             android:id="@+id/Edit9"  
    84.             android:layout_width="50dp"  
    85.             android:layout_height="40dp"  
    86.             android:layout_weight="1"  
    87.             android:text="0" />  
    88.   
    89.         <EditText  
    90.             android:id="@+id/Edit10"  
    91.             android:layout_width="50dp"  
    92.             android:layout_height="40dp"  
    93.             android:layout_weight="1"  
    94.             android:text="0" />  
    95.     </LinearLayout>  
    96.   
    97.     <LinearLayout  
    98.         android:id="@+id/colorlayout3"  
    99.         android:layout_width="fill_parent"  
    100.         android:layout_height="wrap_content"  
    101.         android:orientation="horizontal" >  
    102.   
    103.         <EditText  
    104.             android:id="@+id/Edit11"  
    105.             android:layout_width="50dp"  
    106.             android:layout_height="40dp"  
    107.             android:layout_weight="1"  
    108.             android:text="0" />  
    109.   
    110.         <EditText  
    111.             android:id="@+id/Edit12"  
    112.             android:layout_width="50dp"  
    113.             android:layout_height="40dp"  
    114.             android:layout_weight="1"  
    115.             android:text="0" />  
    116.   
    117.         <EditText  
    118.             android:id="@+id/Edit13"  
    119.             android:layout_width="50dp"  
    120.             android:layout_height="40dp"  
    121.             android:layout_weight="1"  
    122.             android:text="1" />  
    123.   
    124.         <EditText  
    125.             android:id="@+id/Edit14"  
    126.             android:layout_width="50dp"  
    127.             android:layout_height="40dp"  
    128.             android:layout_weight="1"  
    129.             android:text="0" />  
    130.   
    131.         <EditText  
    132.             android:id="@+id/Edit15"  
    133.             android:layout_width="50dp"  
    134.             android:layout_height="40dp"  
    135.             android:layout_weight="1"  
    136.             android:text="0" />  
    137.     </LinearLayout>  
    138.   
    139.     <LinearLayout  
    140.         android:id="@+id/colorlayout4"  
    141.         android:layout_width="fill_parent"  
    142.         android:layout_height="wrap_content"  
    143.         android:orientation="horizontal" >  
    144.   
    145.         <EditText  
    146.             android:id="@+id/Edit16"  
    147.             android:layout_width="50dp"  
    148.             android:layout_height="40dp"  
    149.             android:layout_weight="1"  
    150.             android:text="0" />  
    151.   
    152.         <EditText  
    153.             android:id="@+id/Edit17"  
    154.             android:layout_width="50dp"  
    155.             android:layout_height="40dp"  
    156.             android:layout_weight="1"  
    157.             android:text="0" />  
    158.   
    159.         <EditText  
    160.             android:id="@+id/Edit18"  
    161.             android:layout_width="50dp"  
    162.             android:layout_height="40dp"  
    163.             android:layout_weight="1"  
    164.             android:text="0" />  
    165.   
    166.         <EditText  
    167.             android:id="@+id/Edit19"  
    168.             android:layout_width="50dp"  
    169.             android:layout_height="40dp"  
    170.             android:layout_weight="1"  
    171.             android:text="1" />  
    172.   
    173.         <EditText  
    174.             android:id="@+id/Edit20"  
    175.             android:layout_width="50dp"  
    176.             android:layout_height="40dp"  
    177.             android:layout_weight="1"  
    178.             android:text="0" />  
    179.     </LinearLayout>  
    180.   
    181.     <Button  
    182.         android:id="@+id/Button"  
    183.         android:layout_width="fill_parent"  
    184.         android:layout_height="wrap_content"  
    185.         android:layout_marginBottom="0dp"  
    186.         android:text="提交" />  
    187.   
    188. </LinearLayout>  


    步骤三：完成我们的Activity

    [java] view plain copy
    1. package com.mycolor;  
    2.   
    3. import android.app.Activity;  
    4. import android.os.Bundle;  
    5. import android.view.View;  
    6. import android.view.View.OnClickListener;  
    7. import android.widget.Button;  
    8. import android.widget.EditText;  
    9.   
    10. public class ColorActivity extends Activity  implements OnClickListener{  
    11.       
    12.       
    13.     private Button button = null;  
    14.     private ColorView colorView = null;  
    15.     private EditText[] editTextArray = null;  
    16.     private float colorArray[] = null;  
    17.     private int[] EditTextID = {R.id.Edit1,R.id.Edit2,R.id.Edit3,R.id.Edit4,R.id.Edit5,  
    18.                                 R.id.Edit6,R.id.Edit7,R.id.Edit8,R.id.Edit9,R.id.Edit10,  
    19.                                 R.id.Edit11,R.id.Edit12,R.id.Edit13,R.id.Edit14,R.id.Edit15,  
    20.                                 R.id.Edit16,R.id.Edit17,R.id.Edit18,R.id.Edit19,R.id.Edit20};  
    21.     @Override  
    22.     public void onCreate(Bundle savedInstanceState) {  
    23.         super.onCreate(savedInstanceState);  
    24.         setContentView(R.layout.main);  
    25.           
    26.           
    27.         button = (Button)findViewById(R.id.Button);  
    28.         button.setOnClickListener(this);  
    29.           
    30.         editTextArray = new EditText[20];  
    31.         colorArray = new float[20];  
    32.         for(int i = 0;i < 20;i++){  
    33.             editTextArray[i] = (EditText)findViewById(EditTextID[i]);  
    34.         }  
    35.           
    36.         colorView = (ColorView)findViewById(R.id.myColorView);  
    37.     }  
    38.     @Override  
    39.     public void onClick(View v) {  
    40.         for(int i = 0;i < 20;i++){  
    41.             colorArray[i] = Float.valueOf(editTextArray[i].getText().toString().trim());  
    42.             System.out.println("i = " + i + ":" + editTextArray[i].getText().toString().trim());  
    43.         }  
    44.         colorView.setColorArray(colorArray);  
    45.     }  
    46. }  


    这样就可以了。

    效果图：


    改变值可以呈现不同的效果：




    原文参考：点击打开链接

    代码：点击下载
  • 相关阅读:
    高效代码审查的十个经验
    记事本
    cocos2d-x游戏引擎核心之十一——并发编程（消息通知中心）
    DE1-SOC开发板使用学习
    反思的话-180929
    反思的话-企业制度的作用180927
    XDS100V3连接Pandaboard ES OMAP4460开发板
    《手把手教你学DSP-基于TMS320F28335》书中的错误
    DSP28335做FFT傅里叶变换
    itop4412学习-上层应用多任务开发
  • 原文地址：https://www.cnblogs.com/Free-Thinker/p/6722684.html
Copyright © 2020-2023  润新知