Android - Canvas 簡單總結

在自定義控件時，常常須要使用canvas、paint等，在canvas類中，繪畫基本都是靠drawXXX()方法來完成的，在這些方法中，不少時候都須要用到paint類型的參數，本文先對paint類經常使用的一些設置作個簡單總結

paint 屬性設置簡單總結

圖形繪製相關：

public void set(Paint src)  根據已有畫筆的屬性進行賦值

public void setColor(int color) 設置顏色

public void setAlpha(int alpha) 設置透明度，alpha爲透明度,取值範圍爲0~255,數值越小越透明

public void setARGB(int a, int r, int g, int b)  設置透明度和顏色，a表明透明度，r，g，b表明顏色值

public void setAntiAlias(boolean aa) 設置是否使用抗鋸齒功能，比較耗資源，減慢繪製速度

public void setDither(boolean dither) 設定是否使用圖像抖動，如true，繪製出來的圖片顏色更飽滿、清晰  

public void setStyle(android.graphics._Original_Paint.Style style) 設置畫筆的樣式，爲FILL，FILL_OR_STROKE，或STROKE  

如下這段文字來源於網絡，謝謝做者！

當咱們在調用drawCircle、drawOval、drawArc、drawRect等方法時，咱們既能夠繪製對應圖形的填充面，也能夠只繪製該圖形的輪廓線，控制的關鍵在於畫筆Paint中的style。Paint經過setStyle方法設置要繪製的類型，style有取三種值：Paint.Style.FILL、Paint.Style.STROKE和Paint.Style.FILL_AND_STROKE。

當style爲FILL時，繪製是填充面，FILL是Paint默認的style；

當style爲STROKE時，繪製的是圖形的輪廓線；

當style爲FILL_AND_STROKE時，同時繪製填充面和輪廓線，不過這種狀況用的很少，由於填充面和輪廓線是用同一種顏色繪製的，區分不出輪廓線的效果。

public void setStrokeCap(Cap cap) 

當畫筆樣式爲STROKE或FILL_OR_STROKE時，設置筆刷的圖形樣式，如圓形樣式  Cap.ROUND,或方形樣式Cap.SQUARE  

public void setStrokeWidth(float width) 當畫筆樣式爲STROKE或FILL_OR_STROKE時，設置筆刷的粗細度       

文字繪製相關：

public void setTextSize(float textSize) 設置文字大小

public void setTextScaleX(float scaleX) 設置文字x軸的縮放比例，能夠實現文字的拉伸效果  

public void setTextSkewX(float skewX)  設置文字傾斜弧度  

public void setUnderlineText(boolean flag) 設置文字下劃線效果    

public void setStrikeThruText(boolean flag) 設置刪除線效果

public Typeface setTypeface(Typeface typeface) 設置字體風格    

public void setTextAlign(android.graphics._Original_Paint.Align align) 設置文字的對齊方向  

其中有兩個屬性設置須要做說明：

一、public Typeface setTypeface(Typeface typeface) ，接收參數爲 Typeface對象，在Typeface.java類中，比較簡單的，有defaultFromStyle方法返回Typeface對象：

public static Typeface defaultFromStyle(int style) {}

二、public void setTextAlign(android.graphics._Original_Paint.Align align) 設置文字的對齊方向，接收的參數爲Paint的內部枚舉類Align的值，可選LEFT、CENTER和RIGHT。

下邊是文字繪製時經常使用的屬性設置例子：

public void draw(Canvas canvas) {
    super.draw(canvas);
    paint.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD));
    paint.setColor(Color.RED);
    paint.setTextSize(41);
    paint.setTextAlign(Align.CENTER);
    paint.setTextScaleX(2.5f);
    paint.setTextSkewX(-0.5f);
    paint.setUnderlineText(true);
    paint.setStrikeThruText(true);
    canvas.drawText("hwgt的博客", 0, 41, paint);
    ... ...
}

另外，須要注意的是：Canvas的drawText()方法中，如不setTextAlign(... ...)的話，第二個參數 x 默認是字符串的左邊的位置，第三個參數則固定爲這個字符串的baseline的位置。

 

Canvas屬性與方法

首先列出canvas以draw開頭的方法：

設置ARGB、顏色填充畫布：

public void drawARGB(int a, int r, int g, int b) {}
public void drawColor(int color) {}
public void drawRGB(int r, int g, int b) {}
canvas.drawARGB(50, 255, 0, 0);//參數即爲ARGB的值

畫點：

public native void drawPoint(float x, float y, Paint paint);
  //參數比較明顯，就是點的座標，須要注意的是，在繪製點以前，須要設置畫筆的寬度，不然不能畫出來
  paint.setStrokeWidth(13);
  //另外，還能夠設置畫筆的樣式，來指定所畫的點的樣式，圓形仍是方形
  paint.setStrokeCap(Paint.Cap.ROUND);//或者paint.setStrokeCap(Paint.Cap.BUTT);
  canvas.drawPoint(100, 100, paint);

畫直線：

public void drawLine(float startX, float startY, float stopX, float stopY, Paint paint) {}
canvas.drawLine(100, 100, 500, 500, paint);//參數爲起點和終點的XY座標

畫圓：

public void drawCircle(float cx, float cy, float radius, Paint paint) {}
canvas.drawCircle(200, 200, 100, paint);//參數爲圓心座標和半徑

繪製矩形：

public void drawRect(float left, float top, float right, float bottom, Paint paint) {}
public void drawRect(RectF rect, Paint paint) {}
public void drawRect(Rect r, Paint paint) {}
// RectF 和 Rect  均可用來定義一個矩形區域，主要區別是參數類型不一樣，一個是int類型，一個是float類型
private RectF mRectF;
mRectF = new RectF(100, 100, 200, 500);
canvas.drawRect(mRectF, paint);

繪製圓角矩形：

public void drawRoundRect(RectF rect, float rx, float ry, Paint paint) {}
private RectF mRectF;
mRectF = new RectF(100, 100, 500, 500);//定義一個區域
canvas.drawRoundRect(mRectF, 20, 50, paint); //第2、三個參數分別定義x和y方向的圓角弧度

繪製一個區域的內切圓或橢圓（視所定義的矩形而定）：

public void drawOval(RectF oval, Paint paint) {}
private RectF mRectF;
mRectF = new RectF(100, 100, 200, 500);
canvas.drawOval(mRectF, paint);

繪製弧形區域：

public void drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter,Paint paint) {}
private RectF mRectF;
mRectF = new RectF(100, 100, 200, 200);//定義一個矩形區域
canvas.drawArc(mRectF, 0, 90, false, paint);
//第二個參數爲起始弧度，第三個爲終止弧度，第四個爲顯示方式

繪製路徑 — Path 的使用：

public void drawPath(Path path, Paint paint) {}
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(3);
mPath = new Path();
mPath.moveTo(100, 100);
mPath.lineTo(200, 100);
mPath.lineTo(150, 150);
mPath.lineTo(150, 350);
mPath.close();
canvas.drawPath(mPath, paint);

繪製路徑，即指定幾個點的座標，而後按照順序將這些點鏈接起來，那麼，首先須要指定起點，使用moveTo方法，若是沒有使用moveTo方法指定起點的話，默認起點爲（0,9），而後用lineTo方法指定須要通過的點，最後，若是起點和終點的座標不同，而且須要將起點和終點鏈接起來的話，就調用close方法，如不調用close方法的話，起點和終點是不會被鏈接起來的。

繪製文本：

public void drawText(String text, float x, float y, Paint paint) {}
public void drawText(char[] text, int index, int count, float x, float y, Paint paint) {}
public void drawText(String text, int start, int end, float x, float y, Paint paint) {}
canvas.drawText("hwgt", 100, 100, paint);
canvas.drawText(new char [] {'h','w','g','t','3','1','3','3'}, 2, 3, 100, 100, paint);
canvas.drawText("hwgt3133", 2, 4, 100, 100, paint); //含頭不含尾

按照指定點的座標繪製文本：

public void drawPosText(String text, float[] pos, Paint paint) {}
public void drawPosText(char[] text, int index, int count, float[] pos, Paint paint) {}
canvas.drawPosText("hwgt", new float[]{50.0f,50.0f,100.0f,100.0f,250.0f,250.0f,500.0f,500.0f,}, paint);
canvas.drawPosText(new char[]{'h','w','g','t'}, 3, 1, new float[]{50.0f,50.0f,100.0f,100.0f,250.0f,250.0f,500.0f,500.0f,}, paint);
//推薦使用第二個方法，if (index < 0 || index + count > text.length || count*2 > pos.length)，就會報錯

按照指定的路徑繪製文本：

public void drawTextOnPath(String text, Path path, float hOffset, float vOffset, Paint paint) {}

canvas的save和restore方法：

在繪製圖形的過程當中，會須要對畫布進行旋轉，縮放，平移等操做，但對畫布進行好比平移操做以後，會對之後畫上去的內容也產生影響，有時，咱們只但願這種平移或是旋轉操做只是臨時做用於畫布上的某些內容，這個時候就可使用save和restore方法，save和restore方法通常是配對使用的，例如：

paint.setFakeBoldText(true); // 將畫筆設置爲粗體
canvas.drawText("00000000", 0, 75, paint);
canvas.save();
canvas.translate(0, 250);
canvas.drawText("||||||||||||||||", 0, 75, paint);
canvas.restore();
canvas.drawText("—————", 0, 75, paint);

去掉save和restore方法即能看出效果。

 

暫時總結到這裏，後續再作補充