大家都知道Android的UI很強大，各種系統控制元件和自定義控制元件，實現了很多絢麗的效果。而這些都離不開我們這篇文章講到的Paint和Canvas。

Android提供了Canvas（畫布）和Paint（畫筆）用來實現檢視的繪製工作。

之所以把Paint和Canvas放到一起講，是因為這兩個東西本身就是一體的，只有在一起才能畫出各種圖形。

作為畫筆來講，Paint可以設定各種屬性，來達到畫出不同線條的作用。就拿平時素描來講，我會用到2B，4B，1H等不同的鉛筆，那Paint，畫筆類就是通過設定不同的屬性來達到這一效果的。

Canvas，可以理解為在手機螢幕上的一塊可供繪製的區域，用Paint可以畫出各種圖形。其提供了很多繪製的方法，可以和Paint一起畫出各種圖形。

先貼一段程式碼

    // 畫圓用到的paint
    mPaintCircle = new Paint();
    mPaintCircle.setStyle(Paint.Style.STROKE); // 描邊
    mPaintCircle.setStrokeWidth(1); // 寬度
    mPaintCircle.setAlpha(100); // 透明度
    mPaintCircle.setAntiAlias(true); // 抗鋸齒
    mPaintCircle.setColor(Color.parseColor("#B0C4DE")); // 設定顏色 亮鋼蘭色

可知Paint是通過new關鍵字來獲得例項的。並且提供了一系列的setxxx()方法來設定屬性。

這裡先貼出幾種常用的方法，具體的我會單獨開出一篇文章來講。

setStyle(Style style) 用來設定填充樣式

Paint類中的列舉型別 Style， 提供了三種可供選擇的值。STROKE ， FILL ， FILL_AND_STROKE

STROKE 的區別還是很明顯的，我願意把他叫做描邊。

Fill 填充 ，FILL_AND_STROKE 填充和描邊 。這兩個從前邊的圓上看不是很明顯，但是從後邊的字，就會發現，相同字號，FILL_AND_STROKE 要比 Fill 方式粗一些，其實就是在填充的基礎上，外邊加了一圈描邊。

setStrokeWidth(float width) 用來設定Stroke的寬度

setAlpha(int a) 用來設定透明度

setAntiAlias(boolean aa) 用來設定抗鋸齒
如果不設定，載入點陣圖的時候可能會出現鋸齒狀的邊界，如果設定，邊界就會變的稍微有點模糊，鋸齒就看不到了。

setColor(@ColorInt int color) 用來設定顏色

後面的這幾個方法，我相信大家看見名就知道怎麼用了，所以就不詳細說明了。

上面我們看見都是對Paint的一些屬性設定，並沒有執行繪製動作。那麼，Android是怎樣用Paint畫出各種圖形的呢，這就需要用到Canvas。

Canvas中我們常用的方法都是以 draw 開頭的，意思是在畫布上畫各種圖形
這裡先貼出一些常用的方法

drawLine (float startX, float startY, float stopX, float stopY, Paint paint) 畫直線

startX:開始點X座標
startY:開始點Y座標
stopX:結束點X座標
stopY:結束點Y座標
paint:畫筆

drawLines (float[] pts, Paint paint)
drawLines (float[] pts, int offset, int count, Paint paint) 畫多條直線

上述兩個方法可以繪製多條直線，pts是x，y座標的陣列，值得注意的是如果這裡的座標是（x1，y1，x2，y2，x3，y3，x4，y4）那麼繪製的直線將是點（x1，y1），（x2，y2）的連線以及（x3，y3），（x4，y4）的連線，總共兩條連線。

offset 跳過的資料數，count 實際參與繪製的資料數。

 // 起點為100,100 終點為100,500 畫一條線
 canvas.drawLine(100, 100, 100, 500, mPaintLine);

 // 兩個資料為一個點，兩個點為一組話一條線。所以是起點為200,200 終點為300,300 一條線， 起點為400,400 終點為500,500 一條線
 float[] pts = new float[]{200, 200, 300, 300, 400, 400, 500, 500};
 mPaintLine.setColor(Color.parseColor("#DEB887")); // 實木色
 canvas.drawLines(pts, mPaintLine);

 // 這裡跳過了2個數據，參與繪製了四個資料，所以是 起點為400,300 終點為500,400 一條線
 pts = new float[]{300, 200, 400, 300, 500, 400, 600, 500};
 mPaintLine.setColor(Color.parseColor("#FF4500")); // 橘紅色.
 canvas.drawLines(pts, 2, 4, mPaintLine);

所以是下圖的效果

drawPoint (float x, float y, Paint paint) 畫點

在座標 x y 處，繪製一個點。

drawPoints (float[] pts, Paint paint)
drawPoints (float[] pts, int offset, int count, Paint paint) 畫多個點

繪製多個點，方法和drawLines差不多，就不贅述了。

drawRect (float left, float top, float right, float bottom, Paint paint)
drawRect (RectF rect, Paint paint)
drawRect (Rect r, Paint paint) 畫矩形

第一個方法，傳入了四個點，這個很容易理解。其實就是兩個點 left和top為左上的點，right和bottom為右下的點
第二個和第三個方法，傳入了兩個引數，RectF和Rect

RectF和Rect 是矩形的輔助類，他們都提供了通過傳入四個點的座標來構建矩形的構造方法。這裡我們需要注意RectF類的構造方法傳入的是Float型別的引數，而Rect傳入的是int型別的

RectF(float left, float top, float right, float bottom)
Rect(int left, int top, int right, int bottom)

// 聲明瞭一個Rect的物件
Rect rect = new Rect(100, 600, 500, 800);
canvas.drawRect(rect, mPaintLine);

// 聲明瞭一個RectF的物件
RectF rectf = new RectF(600, 600, 1000, 800);
// 這裡設定了Paint為填充方式，所以矩形應該為一個實心的矩形
mPaintLine.setStyle(Paint.Style.FILL);
canvas.drawRect(rectf, mPaintLine);

drawRoundRect(RectF rect, float rx, float ry, Paint paint)
drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint) 畫圓角矩形

通過傳入四個點座標或者RectF來畫一個矩形，其中 rx 和 ry 是X軸上和Y軸上的圓角半徑。（其實這個圓角可以看成是一個橢圓，通過調整x軸和y軸的座標來調整圓角的大小）

drawOval(RectF oval, Paint paint)
drawOval(float left, float top, float right, float bottom, Paint paint) 畫橢圓

可以看見畫橢圓的方法傳入的是一個矩形，其實這個橢圓是這個矩形的內切橢圓

RectF rectf = new RectF(600, 600, 1000, 800);
canvas.drawRoundRect(rectf, 10, 30, mPaintLine);
canvas.drawOval(rectf, mPaintLine);

原諒我的懶惰，我把圓角矩形和橢圓放在一起了，可以看到橢圓確實是矩形的內切圓

drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint)
drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter,Paint paint) 畫圓弧

跟橢圓一樣，也是傳入了一個矩形，然後通過startAngle和sweepAngle來控制圓弧的角度

startAngle：開始的角度
sweepAngle：圓弧掃過的角度
userCenter：是否吧圓心包括在內

注意這個角度是從最右邊為0度，以順時針開始計算的。

RectF rectf = new RectF(600, 600, 1000, 800);
canvas.drawArc(rectf, 0, 80, false, mPaintLine);
rectf = new RectF(100, 600, 500, 800);
canvas.drawArc(rectf, 0, 80, true, mPaintLine);