Android 圖片特效(一):色相、飽和度與亮度
平時的圖片在使用了美圖秀秀之後就會呈現不一樣的效果,就像上面的圖片展示的那樣(上圖是一張美圖秀秀的使用截圖)。實際上上面的效果離不開色彩的三要素——色相、飽和度和亮度。人眼看到的任一彩色光都是這三個特性的綜合效果。其中色調與光波的波長有直接關係,亮度和飽和度與光波的幅度有關。簡單總結一下:
1,色相:色相通俗的說就是“顏色”,色相的改變就是顏色的改變,色相的調節伴隨著紅橙黃綠藍紫的變化。
2,明度:明度通俗的說就是“光照度”,明度的改變就是光照在物體上帶來的改變,明度的調節伴隨著越高,光越強,越泛白(就像過曝一樣,往白色上偏離);越低,光越弱,越往黑裡偏
3,飽和度:飽和度通俗的說就是“色彩的純度”,飽和度的改變會影響顏色的鮮豔程度,以紅色為例子,越高,越接近紅色,越低則越接近灰色(黑白)
在理解了色彩的三元素之後就可以通過他們三個對圖片進行處理了!要實現的效果圖如下:
一、色相、飽和度、亮度
色相
要實現對圖片色相的處理,我們需要一個ColorMatrix(顏色矩陣),通過顏色矩陣的setRotate來對該顏色矩陣進行設定。
ColorMatrix huematrix=new ColorMatrix();
huematrix.setRotate(0,hue);//引數0表示R,對紅色進行設定數值
//hue為設定數值,這裡用了相同的三個值
huematrix.setRotate(1,hue);//引數1表示G,對綠色進行設定數值
huematrix.setRotate(2, hue);//引數2表示B,對藍色進行設定數值
飽和度
//建立顏色矩陣,設定飽和度
ColorMatrix saturationmatrix=new ColorMatrix();
saturationmatrix.setSaturation(saturation);
亮度
ColorMatrix lummatrix=new ColorMatrix();
//引數:rscale gscale bscale (設定了三個相同的數值)透明度(完全顯示)
lummatrix.setScale(lum,lum,lum,1 );
色彩三元素綜合作用
要想將色彩三元素綜合運用到一張圖片上還需要建立一個ColorMatrix矩陣,通過顏色矩陣的postConcat屬性將三元素進行綜合。
ColorMatrix imagematrix=new ColorMatrix();
imagematrix.postConcat(huematrix);
imagematrix.postConcat(saturationmatrix);
imagematrix.postConcat(lummatrix);
二、程式碼實現
思路
1、佈局很簡單就是ImageView+三個SeekBar
2、建立圖片的處理類ImageOperation,在此類中進行對Bitmap圖片的處理,在MainActivity中為imageView動態新增Bitmap。
ps:在圖片的處理類ImageOperation中,傳入圖片Bitmap,由於傳入的圖片預設是不可更改的,需要我們重新建立新的Bitmap,處理完圖片後返回新建的Bitmap即可。
程式碼
佈局不再進行展示
public class ImageOperation {
//傳入需要修改的Bitmap和色彩三元素
public static Bitmap imageoperation (Bitmap mbitmap ,float hue,float saturation,float lum){
//傳入的Bitmap預設不可修改,需啊喲建立新的Bitmap
Bitmap mbitmap_fu=Bitmap.createBitmap(mbitmap.getWidth(),mbitmap.getHeight(), Bitmap.Config.ARGB_8888);
//建立畫布,在新的bitmap上繪製
Canvas canvas=new Canvas(mbitmap_fu);
//設定畫筆抗鋸齒,後面在Bitmap上繪製需要使用到畫筆
Paint mpaint=new Paint(Paint.ANTI_ALIAS_FLAG);
ColorMatrix huematrix=new ColorMatrix();
huematrix.setRotate(0,hue);
huematrix.setRotate(1,hue);
huematrix.setRotate(2, hue);
ColorMatrix saturationmatrix=new ColorMatrix();
saturationmatrix.setSaturation(saturation);
ColorMatrix lummatrix=new ColorMatrix();
//引數:rscale gscale bscale 透明度
lummatrix.setScale(lum,lum,lum,1);
ColorMatrix imagematrix=new ColorMatrix();
imagematrix.postConcat(huematrix);
imagematrix.postConcat(saturationmatrix);
imagematrix.postConcat(lummatrix);
//通過畫筆的setColorFilter進行設定
mpaint.setColorFilter(new ColorMatrixColorFilter(imagematrix));
canvas.drawBitmap(mbitmap,0,0,mpaint);
return mbitmap_fu;
}
}
MainActivity
public class MainActivity extends Activity implements SeekBar.OnSeekBarChangeListener{
private SeekBar mseekbar_hue;
private SeekBar mseekbar_lum;
private SeekBar mseekbar_saturation;
private ImageView imageView;
private float mhue,msaturation,mlum;
private static int MID_VALUE=127;
private Bitmap mbitmap;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mbitmap= BitmapFactory.decodeResource(getResources(), R.mipmap.tu);
mseekbar_hue= (SeekBar) findViewById(R.id.seekBar);
mseekbar_saturation= (SeekBar) findViewById(R.id.seekBar1);
mseekbar_lum= (SeekBar) findViewById(R.id.seekBar2);
imageView= (ImageView) findViewById(R.id.image);
imageView.setImageBitmap(mbitmap);
//對SeekBar設定最大值與初始值
mseekbar_hue.setMax(255);
mseekbar_hue.setProgress(MID_VALUE);
//對seekbar的改變就行監聽
mseekbar_hue.setOnSeekBarChangeListener(this);
mseekbar_saturation.setMax(255);
mseekbar_saturation.setProgress(MID_VALUE);
mseekbar_saturation.setOnSeekBarChangeListener(this);
mseekbar_lum.setMax(255);
mseekbar_lum.setProgress(MID_VALUE);
mseekbar_lum.setOnSeekBarChangeListener(this);
}
//監聽Seekbar的變化
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
switch (seekBar.getId()){
case R.id.seekBar:
//這裡給出的是一個加經驗值
mhue=(progress-MID_VALUE)*1.0f/255*180;
break;
case R.id.seekBar1:
msaturation=progress*1.0f/MID_VALUE;
break;
case R.id.seekBar2:
mlum=progress*1.0f/MID_VALUE;
break;
}
imageView.setImageBitmap(ImageOperation.imageoperation(mbitmap, mhue, msaturation, mlum));
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
}
}