Android 繪圖學(xué)習(xí)

1 PathEffect 概念

Paint的setPathEffect函數(shù)用于設(shè)置繪制幾何時(shí)的路徑樣式（線條的輪廓）裤园，PathEffect從名字就可以知道主要作用于Path路徑啡捶，PathEffect是個(gè)基類嗽测，要實(shí)現(xiàn)具體功能需要利用具體的實(shí)現(xiàn)類奇瘦。
PathEffect的實(shí)現(xiàn)類包括ComposePathEffect,CornerPathEffect,DashPathEffect,DiscretePathEffect,PathDashPathEffect,SumPathEffect。

各個(gè)實(shí)現(xiàn)類的作用：
ComposePathEffect和SumPathEffect用于組合兩種路徑效果鹦牛，
CornerPathEffect設(shè)置路徑連線之間的夾角更加平滑羹幸，圓潤(rùn)，
DashPathEffect赁遗，PathDashPathEffect虛線效果署辉，動(dòng)態(tài)改變會(huì)產(chǎn)生動(dòng)畫效果，
DiscretePathEffect會(huì)產(chǎn)生一種離散效果岩四，具體就是會(huì)在路徑上繪制許多雜點(diǎn)哭尝。

2 CornerPathEffect：

/**

• Transforms geometries that are drawn (either STROKE or FILL styles) by
• replacing any sharp angles between line segments into rounded angles of
• the specified radius.
• @param radius Amount to round sharp angles between line segments.
  */

將Path的各個(gè)連接線段之間的夾角用一種更平滑的方式連接，一般的剖煌，通過CornerPathEffect(float radius)指定一個(gè)具體的圓弧半徑來實(shí)例化一個(gè)CornerPathEffect材鹦。利用指定半徑圓的角替換多個(gè)線段之間的連接點(diǎn)，參數(shù)radius就是線段之間的圓角的圓滑程度（連接兩條直線所使用的圓的半徑）耕姊。

示例代碼：

mPaint1 = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint1.setColor(Color.BLUE);
mPaint1.setStrokeWidth(10);
mPaint1.setStyle(Paint.Style.STROKE);
mPath1 = new Path();
mPath1.moveTo(150,250);
mPath1.lineTo(250,320);
mPath1.lineTo(300,300);
mPath1.lineTo(350,350);
mPath1.lineTo(420,270);
mPath1.lineTo(540,370);
mPath1.lineTo(560,300);
mPath1.lineTo(650,340);
mPath1.lineTo(750,270);
mPath1.lineTo(850,330);
mPath1.lineTo(950,240);
mPath1.lineTo(1050,290);
mPath1.lineTo(1150,350);
mPath1.lineTo(1250,230);

mPaint2 = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint2.setColor(Color.BLUE);
mPaint2.setStrokeWidth(10);
mPaint2.setStyle(Paint.Style.STROKE);
mPaint2.setPathEffect(new CornerPathEffect(30));

mPath2 = new Path();
mPath2.moveTo(150,550);
mPath2.lineTo(250,620);
mPath2.lineTo(300,600);
mPath2.lineTo(350,650);
mPath2.lineTo(420,570);
mPath2.lineTo(540,670);
mPath2.lineTo(560,600);
mPath2.lineTo(650,640);
mPath2.lineTo(750,570);
mPath2.lineTo(850,630);
mPath2.lineTo(950,540);
mPath2.lineTo(1050,590);
mPath2.lineTo(1150,650);
mPath2.lineTo(1250,530);

canvas.drawPath(mPath1,mPaint1);
canvas.drawPath(mPath2,mPaint2);

canvas.drawRect(200,800,700,1100,mPaint2);

mPaint2.setTextSize(130);
mPaint2.setStrokeWidth(5);
mPaint1.setTextSize(130);
mPaint1.setStrokeWidth(5);

canvas.drawText("歡迎桶唐，你好啊箩做！",200,1400,mPaint1);

canvas.drawText("歡迎莽红，你好啊邦邦！",200,1700,mPaint2);

從圖中可以明顯看到設(shè)置了CornerPathEffect的路徑更加的平滑安吁，對(duì)繪制的矩形也有平滑作用，效果類似繪制圓角矩形燃辖，對(duì)文字沒有效果鬼店。
Paint的Style設(shè)置為Stroke和FILL_AND_STROKE時(shí)對(duì)線段和矩形都有圓滑作用，設(shè)置為FILL（沒有描邊）時(shí)只對(duì)直線有作用黔龟，對(duì)矩形沒有作用妇智。

設(shè)置為FILL_AND_STROKE

設(shè)置為FILL：

3 DashPathEffect，PathDashPathEffect

/**
 * The intervals array must contain an even number of entries (>=2), with
 * the even indices specifying the "on" intervals, and the odd indices
 * specifying the "off" intervals. phase is an offset into the intervals
 * array (mod the sum of all of the intervals). The intervals array
 * controls the length of the dashes. The paint's strokeWidth controls the
 * thickness of the dashes.
 * Note: this patheffect only affects drawing with the paint's style is set
 * to STROKE or FILL_AND_STROKE. It is ignored if the drawing is done with
 * style == FILL.
 * @param intervals array of ON and OFF distances
 * @param phase offset into the intervals array
 */

DashPathEffect將Path的線段虛線化氏身，構(gòu)造函數(shù)為DashPathEffect(float[] intervals, float offset)巍棱，intervals:是間隔數(shù)組，作為實(shí)線蛋欣，虛線的開關(guān)航徙，設(shè)置虛線實(shí)線的長(zhǎng)度，該數(shù)組的length必須大于等于2陷虎，如果設(shè)置兩個(gè)參數(shù)就按兩個(gè)參數(shù)循環(huán)到踏，第一個(gè)參數(shù)為“實(shí)線長(zhǎng)度”杠袱，第二個(gè)參數(shù)為“虛線長(zhǎng)度”后面依次循環(huán)，還可以設(shè)置多個(gè)參數(shù)（如果是奇數(shù)個(gè)參數(shù)窝稿，最后一個(gè)參數(shù)無效楣富，具體沒仔細(xì)驗(yàn)證，如果用到大家仔細(xì)求證下）伴榔。這個(gè)PathEffect只對(duì)設(shè)置Stroke 或者FILL_AND_STROKE 樣式的Paint有效纹蝴，Style為FILL時(shí)則失效。
phase為繪制時(shí)的偏移量踪少，改變這個(gè)值可以實(shí)現(xiàn)類似虛實(shí)交換的動(dòng)畫效果骗灶，phase改變的越大，則動(dòng)畫效果越明顯秉馏。

代碼示例：
float[] array1 = {50,20};
mPaint2.setPathEffect(new DashPathEffect(array1, 5));

動(dòng)態(tài)修改phase：

image

PathDashPathEffect

PathDashPathEffect功能類似DashPathEffect，但是它是利用特定的Path形狀繪制路徑脱羡，只有Paint的style是 STROKE or STROKE_AND_FILL時(shí)起作用萝究，strokeWidth不影響結(jié)果。
構(gòu)造函數(shù)
PathDashPathEffect(Path shape, float advance, float phase,Style style)
參數(shù)說明：
shape：路徑上的形狀锉罐，Path內(nèi)部添加路徑形狀帆竹，類似矩形，三角形等脓规，
advance :兩個(gè)形狀間的距離栽连，如果具體夠大可以放好多形狀，如果距離過小侨舆，只能放置一個(gè)形狀
phase：偏移距離秒紧，和DashPathEffect一樣，可以實(shí)現(xiàn)動(dòng)畫效果挨下。

style是每個(gè)形狀的排列方式）（特別是在轉(zhuǎn)角處）熔恢，共有三種樣式，
TRANSLATE(0), //平移每個(gè)位置的形狀臭笆，就是改變印章的位置叙淌。
ROTATE(1), //繞著每個(gè)形狀的中心旋轉(zhuǎn)
MORPH(2); //每個(gè)點(diǎn)變換形狀, 并把直線變成曲線（在轉(zhuǎn)角處）

ROTATE的情況下，線段連接處的圖形轉(zhuǎn)換以旋轉(zhuǎn)到與下一段移動(dòng)方向相一致的角度進(jìn)行轉(zhuǎn)轉(zhuǎn)愁铺，MORPH時(shí)圖形會(huì)以發(fā)生拉伸或壓縮等變形的情況與下一段相連接鹰霍，TRANSLATE時(shí)，圖形會(huì)以位置平移的方式與下一段相連接茵乱。

shape是有寬高的茂洒，不同的style形狀的繪制方式不同，所以如果advance間距過小似将，所有的形狀都會(huì)繪制在一起获黔，就無法看出具體的形狀了蚀苛，所以設(shè)置advance時(shí)要盡量大一點(diǎn)。

Path tPath = new Path();
tPath.addRect(0f,0f,20f,30f, Path.Direction.CW);
mPaint1.setPathEffect(new PathDashPathEffect(tPath,50,50,PathDashPathEffect.Style.ROTATE));

mPaint2.setPathEffect(new PathDashPathEffect(tPath,50,50,PathDashPathEffect.Style.TRANSLATE));
mPaint3.setPathEffect(new PathDashPathEffect(tPath,50,50,PathDashPathEffect.Style.MORPH));

在路徑上繪制矩形玷氏，分別設(shè)置不同style：

如果設(shè)置advance設(shè)置過卸挛础：

Path tPath = new Path();
tPath.addRect(0f,0f,20f,30f, Path.Direction.CW);
mPaint2.setPathEffect(new PathDashPathEffect(tPath,20,50,PathDashPathEffect.Style.TRANSLATE));
mPaint1.setPathEffect(new PathDashPathEffect(tPath,20,50,PathDashPathEffect.Style.ROTATE));
mPaint3.setPathEffect(new PathDashPathEffect(tPath,20,50,PathDashPathEffect.Style.MORPH));

設(shè)置advance過小，雖然看著不好看盏触，但是可以看出style的效果渗蟹，MORPH通過變形使線段更平滑，TRANSLATE靠平移赞辩，所有的形狀都不會(huì)變形且形狀整體在一條線上雌芽，ROTATE利用旋轉(zhuǎn)，跟平移有點(diǎn)相似辨嗽，但是只有旋轉(zhuǎn)中心在一條線上世落。

5 DiscretePathEffect

這個(gè)類的作用術(shù)語稱為離散路徑，使得在原來路徑的基礎(chǔ)上發(fā)生打散效果糟需。
構(gòu)造函數(shù)：
DiscretePathEffect(float segmentLength,float deviation)
segmentLength指定切割的段長(zhǎng)屉佳，
deviation指定可偏移的距離（離原來的點(diǎn)），越大可偏移的距離越大洲押。
將路徑分隔成定長(zhǎng)的線段武花，然后將每條線段隨機(jī)偏移一段位置，就會(huì)產(chǎn)生打散的效果杈帐。

mPaint1.setPathEffect(new DiscretePathEffect(10,10));
mPaint2.setPathEffect(new DiscretePathEffect(10,30));
mPaint3.setPathEffect(new DiscretePathEffect(20,10));

segmentLength越長(zhǎng)体箕，線段被切割的分成的段越少，離散的點(diǎn)也就越少挑童，
deviation 越大累铅，線段偏移的越厲害，看著也不規(guī)則（毛刺比較多）站叼，
上面的實(shí)例代碼mPaint1和mPaint2 segmentLength相同争群，deviation不同，
mPaint1和mPaint3 deviation相同大年，segmentLength不同换薄。

6 ComposePathEffect與SumPathEffect

都是用來組合兩個(gè)PathEffect的但效果不同。

ComposePathEffect需要兩個(gè)PathEffect參數(shù)來構(gòu)造一個(gè)實(shí)例翔试，
/**
 * Construct a PathEffect whose effect is to apply first the inner effect
 * and the the outer pathEffect (e.g. outer(inner(path))).
 */
ComposePathEffect(PathEffect outerpe, PathEffect innerpe)

作用是先將outerpe的效果作用到路徑上轻要，然后再在變換后的路徑上添加innerpe效果

SumPathEffect：

/**
 * Construct a PathEffect whose effect is to apply two effects, in sequence.
 * (e.g. first(path) + second(path))
 */
public SumPathEffect(PathEffect first, PathEffect second) ;

需要兩個(gè)PathEffect作為參數(shù)，但與ComposePathEffect不同的是垦缅，作用是會(huì)分別對(duì)兩個(gè)參數(shù)的效果各自獨(dú)立進(jìn)行表現(xiàn)冲泥，然后將兩個(gè)效果簡(jiǎn)單的重疊在一起顯示出來。

CornerPathEffect cornerPathEffect = new CornerPathEffect(30);
float[] array1 = {50,20};
DashPathEffect dashPathEffect = new DashPathEffect(array1, phase);
ComposePathEffect composePathEffect = new ComposePathEffect(dashPathEffect, cornerPathEffect);
SumPathEffect sumPathEffect = new SumPathEffect(dashPathEffect, cornerPathEffect);

mPaint1.setPathEffect(composePathEffect);
mPaint2.setPathEffect(sumPathEffect);

mPaint1先圓角，在虛線化凡恍。
mPaint2 圓角和虛線疊加效果志秃。

android繪圖之Paint(1)
android繪圖之Canvas基礎(chǔ)（2）
Android繪圖之Path（3）
Android繪圖之drawText繪制文本相關(guān)（4）
Android繪圖之Canvas概念理解（5）
Android繪圖之Canvas變換（6）
Android繪圖之Canvas狀態(tài)保存和恢復(fù)（7）
Android繪圖之PathEffect （8）
Android繪圖之LinearGradient線性漸變（9）
Android繪圖之SweepGradient（10）
Android繪圖之RadialGradient 放射漸變（11）
Android繪制之BitmapShader（12）
Android繪圖之ComposeShader，PorterDuff.mode及Xfermode（13）
Android繪圖之drawText,getTextBounds,measureText,FontMetrics,基線（14）
Android繪圖之貝塞爾曲線簡(jiǎn)介（15）
Android繪圖之PathMeasure（16）
Android 動(dòng)態(tài)修改漸變 GradientDrawable