Paint之濾鏡和顏色矩陣
請尊重原創(chuàng)，轉(zhuǎn)載請注明出處【tianyl】的博客
前言
之前已經(jīng)說了Paint繪制的一些api和Xfermode，關于Paint的內(nèi)容，也只剩下濾鏡了
濾鏡的定義，可以看百度百科，這里就不重復了，Paint中對濾鏡的使用，主要也就是透明度和顏色兩個方面，而說到顏色，就不得不提一些顏色矩陣，下面就從這幾個方面說起
- 注：本文中的示例代碼使用kotlin編寫
1 顏色矩陣
首先，在Android中顏色是通過一個數(shù)字矩陣進行表示的
（關于矩陣的定義可以查看百度百科）
例如，對于一個顏色用矩陣C表示，對這個顏色的處理方式用矩陣A表示，如下
根據(jù)矩陣的相乘，獲得處理后的顏色矩陣如下：
所以
R1 = aR + bG + cB + dA + e;
G1 = fR + gG + hB + iA + j;
B1 = kR + lG + mB + nA + o;
A1 = pR + qG + rB + sA + t;
當a，g，m，s為1，其他值為0的時候，這個矩陣就是顏色的初始矩陣（經(jīng)過這個矩陣處理后的顏色不會發(fā)生改變）
e，j，o，t就是顏色RGBA的偏移量，a，g，m，s就是RGBA的系數(shù)，通過改變這幾個值，就可以實現(xiàn)一些濾鏡效果
2 BlurMaskFilter
Android直接提供了兩個濾鏡的效果類，分別是EmbossMaskFilter和BlurMaskFilter
BlurMaskFilter是Android中MaskFilter的一個子類，其中MaskFilter有兩個子類
- EmbossMaskFilter：實現(xiàn)類似浮雕的效果
- BlurMaskFilter：實現(xiàn)模糊效果
由于EmbossMaskFilter使用較少，而且官方文檔上顯示已經(jīng)廢棄，所以這里略過，直接說說會用到的BlurMaskFilter
BlurMaskFilter的構(gòu)造方法很簡單
public BlurMaskFilter(float radius, Blur style)
radius是模糊半徑，越大模糊范圍越大
style是模糊風格，它是一個枚舉，有四個值
- NORMAL：整個圖像都被模糊掉
- SOLID：圖像邊界外產(chǎn)生一層與Paint顏色一致陰影效果，不影響圖像的本身
- OUTER：圖像邊界外產(chǎn)生一層陰影，并且將圖像變成透明效果
- INNER：在圖像內(nèi)部邊沿產(chǎn)生模糊效果
它的使用方式如下
private fun init() {
//初始化
mPaint = Paint(Paint.ANTI_ALIAS_FLAG)
mPaint.color = Color.RED
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.png1);
}
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
//不支持硬件加速所以關閉
setLayerType(View.LAYER_TYPE_SOFTWARE, mPaint)
//繪制
val rectF = RectF(100f, 100f, bitmap.width.toFloat()+100f, bitmap.height.toFloat()+100f)
mPaint.setColor(Color.RED)
mPaint.maskFilter = BlurMaskFilter(200f, BlurMaskFilter.Blur.NORMAL)
canvas?.drawBitmap(bitmap, null, rectF, mPaint);
}
具體效果如下
NORMAL
整個圖像都被模糊掉，如上圖左上方SOLID
圖像邊界外產(chǎn)生一層與Paint顏色一致陰影效果，不影響圖像的本身，如上圖右上方OUTER
圖像邊界外產(chǎn)生一層陰影，并且將圖像變成透明效果，如上圖左下方INNER
在圖像內(nèi)部邊沿產(chǎn)生模糊效果，如上圖右下方
3 ColorMatrix
除了直接使用的濾鏡效果，Android中還提供了顏色矩陣，可供我們自己實現(xiàn)自定義的效果
上文說Android中ARGB顏色是矩陣表示的，所以如果我們想對圖像進行顏色處理，那么就可以通過顏色矩陣進行實現(xiàn)，具體的使用方式如下
var floats = floatArrayOf (
1f, 0f, 0f, 0f, 0f,
0f, 1f, 0f, 0f, 0f,
0f, 0f, 1f, 0f, 0f,
0f, 0f, 0f, 0.5f, 0f
)
var colorMartrix = ColorMatrix(floats)
val rectF2 = RectF(600f, 100f, 600f + bitmap.width, bitmap.height.toFloat())
mPaint?.colorFilter = ColorMatrixColorFilter(colorMartrix)
canvas?.drawBitmap(bitmap, null, rectF2, mPaint)
關于顏色矩陣已經(jīng)在第一部分解釋過了，所以這里不再展開，此處的顏色矩陣的作用是將改圖的alpha值乘以0.5，即將圖片變?yōu)榘胪该?，效果如下（左方為原圖，右方是處理后的圖）
