請尊重原創(chuàng)，轉(zhuǎn)載請注明出處【tianyl】的博客

關(guān)于的Android之玩轉(zhuǎn)View目錄

1 前言

上一篇Paint的基礎(chǔ)api介紹了Android中Paint這個類的一些比較常用的api，不過光說不練怎么行呢，這篇就結(jié)合之前介紹的api，來秀一秀可以實(shí)現(xiàn)的各種炫酷特效，話不多說，開工

2 Shader

要使用Paint實(shí)現(xiàn)一些高級特效，那么就少不了一個關(guān)鍵的類Shader

2.1 介紹

Shader在Android中又被稱為著色器，字面意思就是用來上色的，它有很多的實(shí)現(xiàn)類BitmapShader，ComposeShader，LinearGradient，SweepGradient，RadialGradient，下面我們從簡單到復(fù)雜一個一個的介紹這些類

2.1.1 BitmapShader

BitmapShader叫做位圖圖像渲染，用bitmap對繪制的圖形進(jìn)行渲染著色，簡單來說是用圖片對圖形進(jìn)行填充

• 使用方法如下

//這里的mBitMap是我們準(zhǔn)備繪制的圖片
BitmapShader bitMapShader = new BitmapShader(mBitMap, Shader.TileMode.MIRROR,
        Shader.TileMode.MIRROR);
//設(shè)置shader
mPaint.setShader(bitMapShader);
//抗鋸齒
mPaint.setAntiAlias(true);
//隨意繪制一個范圍的圖像，mWidth和mHeight是mBitMap的寬高
canvas.drawRect(0, 0, mWidth*2, mHeight*2, mPaint);

上面代碼就是一個BitmapShader使用的實(shí)例代碼，方法一般寫在onDraw方法中，通過繼承View實(shí)現(xiàn)自定義的效果

• 原圖如下

  
  

• 效果如下

  
  

在BitmapShader的構(gòu)造方法中，有幾個參數(shù)

• TileMode.CLAMP 拉伸最后一個像素去鋪滿剩下的地方
• TileMode.MIRROR 通過鏡像翻轉(zhuǎn)鋪滿剩下的地方
• TileMode.REPEAT 重復(fù)圖片平鋪整個畫面

public BitmapShader(
@NonNull Bitmap bitmap, 
@NonNull TileMode tileX, 
@NonNull TileMode tileY
)

第一個參數(shù)是需要繪制的bitmap，第二個參數(shù)是x軸方向的效果，第三個參數(shù)是y軸方向的效果

上圖就是使用TileMode.MIRROR進(jìn)行實(shí)現(xiàn)的，的使用它可以實(shí)現(xiàn)鏡像的效果，當(dāng)然如果加上漸變的透明度，就是一個很好看的水面倒影了

一個例子

說到BitmapShader，那么再說說一個很常見的功能——圓形圖像/橢圓形圖像

//使用需要繪制的mBitMap構(gòu)造一個BitmapShader
BitmapShader bitMapShader = new BitmapShader(mBitMap, 0,0);
//構(gòu)造一個ShapeDrawable，OvalShape是橢圓形
ShapeDrawable shapeDrawble = new ShapeDrawable(new OvalShape());
//將bitMapShader設(shè)置給ShapeDrawable
shapeDrawble.getPaint().setShader(bitMapShader);
//設(shè)置編輯，圓形就是這個矩形邊界的內(nèi)切圓，如果是正方形，那么就是圓形，反之則是橢圓
shapeDrawble.setBounds(0,0,mWidth,mWidth);
//繪制
shapeDrawble.draw(canvas);

我們知道圓形圖像可以在xml中用shape實(shí)現(xiàn)，那么如何在代碼中實(shí)現(xiàn)shape呢，答案就是ShapeDrawable

當(dāng)然，這里我們不說ShapeDrawable，我們說用ShapeDrawable搭配BitmapShader實(shí)現(xiàn)的圓形頭像

效果如下

2.1.2 LinearGradient

LinearGradient叫做線性渲染，常見的霓虹燈文字，倒影圖片就是使用它進(jìn)行實(shí)現(xiàn)的

線性漸變也是一個用得比較多的漸變，比較多的用法是顏色的漸變和透明度的漸變

構(gòu)造方法如下

int[] mColors = {Color.RED,Color.YELLOW,Color.GREEN,Color.BLUE}
LinearGradient linearGradient = 
    new LinearGradient(0, 0, 400, 400, mColors, null, Shader.TileMode.MIRROR);
mPaint.setShader(linearGradient);
canvas.drawRect(0, 0, 800, 800, mPaint)

• 前4個參數(shù)分別是 x0, y0, x1, y1 表示x軸起點(diǎn)，y軸起點(diǎn)，x軸終點(diǎn)，y軸終點(diǎn)
• mColors是一個color數(shù)組，表示漸變的顏色，我這里分別是紅，黃，綠，藍(lán)
• 第五個參數(shù)是一個float數(shù)組，表示每個顏色所對應(yīng)的位置，也可以理解為每個顏色需要占總長度的多少，取值范圍是從0到1，如果每個顏色的長度相同，即顏色均勻，則可以傳null
• 最后一個參數(shù)就是漸變模式了，和BitmapShader中一樣，這里還是使用鏡像模式（Shader.TileMode.MIRROR）

效果如下

上面說過了，線性漸變可以實(shí)現(xiàn)水面倒影效果，當(dāng)然，還有透明度的漸變也是可以通過線性漸變實(shí)現(xiàn)的

SweepGradient

SweepGradient叫做掃描渲染（或者梯度渲染），就和它的名字一樣，用它可以實(shí)現(xiàn)掃描效果

SweepGradient mSweepGradient = new SweepGradient(400, 400, mColors, null);
mPaint.setShader(mSweepGradient);
canvas.drawCircle(400, 400, 400, mPaint)

mColors還是使用的線性漸變中的顏色
效果如下

它是一個順時針的漸變，如果我們旋轉(zhuǎn)這張圖，那就是一個簡單的掃描效果了，這個比較簡單，看圖就懂，這里就不多說了

RadialGradient

RadialGradient叫做環(huán)形渲染，用它可以實(shí)現(xiàn)水波紋效果
如下是一個簡單的環(huán)形漸變效果

RadialGradient mRadialGradient = 
    new RadialGradient(400, 400, 100, mColors, null, Shader.TileMode.REPEAT);
mPaint.setShader(mRadialGradient);
canvas.drawCircle(400, 400, 400, mPaint)

構(gòu)造參數(shù)

• 前2個分別是圓心的x坐標(biāo)和y坐標(biāo)
• 第3個參數(shù)是漸變的半徑，這里是100
• 第4個是顏色，還是使用的線性漸變用過的顏色
• 第5個參數(shù)和之前線性漸變一樣，一個float數(shù)組，類似于權(quán)重的作用
• 最后一個參數(shù)是漸變模式，這里是反復(fù)，即結(jié)束后重新開始

效果如下

ComposeShader

ComposeShader叫做組合渲染，它是將上面的任意兩種漸變效果進(jìn)行組合，看它的構(gòu)造函數(shù)就可以明白

ComposeShader(Shader shaderA, Shader shaderB, int nativeMode) 

前兩個參數(shù)分別是上面的任意兩種漸變效果，第三個參數(shù)是一個PorterDuff.Mode常量

PorterDuff.Mode的總結(jié)很多，暫時放后面，這里就不引申了