Canvas中drawxxx方法的使用

一:Canvas.drawxxx()系列方法以及Paint常見使用

1:移動坐標系

canvas.translate(width/2,height/2); //可以將坐標系從左上角移動到指定位置
cavas.scale(1,-1);//反轉(zhuǎn)y坐標軸,反轉(zhuǎn)之后向上為正嗽仪,向下為負薪棒。

2:drawRect(float left, float top, float right, float bottom, Paint paint)

畫矩形傳入的是左上點和右下點的坐標初坠。drawRect(左上x,左上y惕稻,右下x崎弃,右下y惶桐,paint);

3:drawPoint(float x, float y, Paint paint)

在畫點的時候,需要paint.setStrokeWidth();不然點看不到淀歇。

(1):畫多個點

 float [] pts={30,100,100,100,170,100,240,100,310,100};
private void init() {
    paint=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.parseColor("#2bb8ed"));
    paint.setStrokeWidth(50);
    paint.setStrokeCap(Paint.Cap.ROUND);
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    canvas.drawPoints(pts,paint);
//        canvas.drawPoints(pts,2,6,paint);
}

(2):畫多個點同時偏移

 float [] pts={30,100,100,100,170,100,240,100,310,100};
    private void init() {
        paint=new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.parseColor("#2bb8ed"));
        paint.setStrokeWidth(50);
        paint.setStrokeCap(Paint.Cap.ROUND);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
//        canvas.drawPoints(pts,paint);
        canvas.drawPoints(pts,2,6,paint);
    }

使用的數(shù)組還是之前的數(shù)組易核,就是在drawPoints的參數(shù)上做了調(diào)整。該方法第二個參數(shù)表示從第幾個數(shù)組元素開始繪制浪默,由于數(shù)組的元素是兩個點構(gòu)成一個坐標牡直,因此偏移兩個位置,即一個點纳决。第三個參數(shù)表示一共使用幾個數(shù)組元素碰逸,在本段代碼中最后將原始數(shù)組進行了截取,相當于使用了下面這個新數(shù)組進行繪制阔加。

 float [] pts={100,100,170,100,240,100};

如果我們將參數(shù)調(diào)整為

canvas.drawPoints(pts,1,7,paint);

將會顯示如下饵史,雖然取了7個元素,但是最后一個元素沒有配對的y坐標胜榔,無法繪制出來胳喷。


4:drawOval(float left, float top, float right, float bottom, @NonNull Paint paint);

前兩個參數(shù)可以認為是橢圓外切矩形的左上點坐標。
接下來的兩個參數(shù)可以認為是橢圓外切矩形的右下點坐標苗分。

5:畫線drawLine(float startX, float startY, float stopX, float stopY,@NonNull Paint paint)

我們通過代碼畫了三條線厌蔽,分別設(shè)置了不同的Cap,三條線除了顏色不一樣和cap不一樣之外摔癣,其他的都一致奴饮。

 private void init() {
    paint=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.RED);
    paint.setStrokeWidth(50);
    paint.setStrokeCap(Paint.Cap.BUTT);

    paint1=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint1.setColor(Color.GRAY);
    paint1.setStrokeWidth(50);
    paint1.setStrokeCap(Paint.Cap.ROUND);

    paint2=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint2.setColor(Color.BLUE);
    paint2.setStrokeWidth(50);
    paint2.setStrokeCap(Paint.Cap.SQUARE);
}
@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    canvas.drawLine(30,30,30,630,paint);
    canvas.drawLine(130,30,130,630,paint1);
    canvas.drawLine(230,30,230,630,paint2);
    }

但是從效果圖中纬向,我們看到的三條線的長度好像并不一致。從代碼中我們知道我們設(shè)置的起始點y坐標是30戴卜,但是只有第一條線滿足了逾条,后面兩條線不滿足,長度為600投剥,也只有第一條滿足了师脂,后面兩條未滿足。因為cap是指當畫筆畫完之后江锨,再給任務(wù)畫一個帽子吃警,這個帽子是多出來的。

和cap類似的還有一個join

public enum Join {  
    /** 
     * The outer edges of a join meet at a sharp angle 
     */  
    MITER   (0),  
    /** 
     * The outer edges of a join meet in a circular arc. 
     */  
    ROUND   (1),  
    /** 
     * The outer edges of a join meet with a straight line 
     */  
    BEVEL   (2);  
      
    private Join(int nativeInt) {  
        this.nativeInt = nativeInt;  
    }  
    final int nativeInt;  
}
圖片來自gcsSloop

6:drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint)

圓角矩形

7:drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter, Paint paint)

扇形或者弧形或者弧線啄育。是否填充全在于paint.setStyle(Paint.Style.);

三點鐘方向為0度酌心。

順時針為正方向。

useCenter表示在兩邊是否用線連接到圓心挑豌。如果連接就是弧形安券,不連接就是扇形。

 private void init() {
    paint=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.RED);
    paint.setStrokeWidth(10);
    paint.setStrokeCap(Paint.Cap.BUTT);
    paint.setStyle(Paint.Style.STROKE);

    paint1=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint1.setColor(Color.GRAY);
    paint1.setStrokeWidth(50);
    paint1.setStrokeCap(Paint.Cap.ROUND);

    paint2=new Paint(Paint.ANTI_ALIAS_FLAG);
    paint2.setColor(Color.BLUE);
    paint2.setStrokeWidth(10);
    paint2.setStrokeCap(Paint.Cap.SQUARE);
}
@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    canvas.drawArc(0, 0, 200, 200, 50, 100, false, paint); 
    canvas.drawArc(0, 200, 300, 400, -360, 100, true, paint); 
    canvas.drawArc(0, 500, 400, 700, -150, 100, false, paint1); 
    canvas.drawArc(400, 500, 500, 600, -150, 100, true, paint1); 

    }

8:drawPath

path有兩種方法氓英,一類是直接描述路徑侯勉,一類是輔助設(shè)置或計算

(1):addCircle/addOval/addArc/addRect/addRoundRect。

最后一個參數(shù)dir表示方向铝阐,有兩個選項址貌,一個是cr順時針,一個是ccr逆時針饰迹。

lineTo/rLineTo 前者是絕對坐標芳誓。后者是相對坐標。都是畫直線啊鸭。
使用path畫粗線的時候锹淌,比如直方圖的粗線,一定要把style設(shè)置為stroke赠制。

畫線的方向就是方向赂摆。

quadTo/rQuadTo 畫二次貝塞爾曲線。


二階貝塞爾曲線圖片來自網(wǎng)絡(luò)

cubicTo/rCubicTo 畫三次貝塞爾曲線


三階貝塞爾曲線圖片來自網(wǎng)絡(luò)
四階貝塞爾曲線圖片來自網(wǎng)絡(luò)
五階貝塞爾曲線圖片來自網(wǎng)絡(luò)

moveTo/rMoveTo 移動到目標位置開始畫起點

moveTo :移動到下一次操作的起點位置
setLastPoint 設(shè)置之前操作的最后一個點位置钟些。這會取消之前的終點位置烟号。如圖所示:

圖片來自gcsSloop

那么在3d旋轉(zhuǎn)的時候,能不能通過setLastPoint來旋轉(zhuǎn)一個點達到效果呢政恍?
重點
arcTo 只畫弧形不畫扇形汪拥。forceMoveTo參數(shù)表示是否留下畫筆的移動痕跡。

addArc()表示forceMoveTo=true的簡化版arcTo篙耗。

close()封閉當前圖形迫筑。終點到起點的連線宪赶。當畫筆為fill的時候,會自動封閉脯燃。

在畫心形的時候搂妻,不要抬筆,也就是不要將forceMoveTo設(shè)置為true辕棚,因為true就以為著是一個新的If true, always begin a new contour with the arc欲主。那么在封閉的時候,只能封閉當前的contour逝嚎,而不能封閉之前的contour了扁瓢。

 path.arcTo(200,100,400,300,150, 210,false);
 path.arcTo(400,100,600,300,180, 210,false);
 path.lineTo(400, 442);

(2):輔助設(shè)置或計算 Path.setFillType(Path.FillType ft)


圖片來自hencoder

參考:
gcsSloop的博客
Hencoder的博客

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市补君,隨后出現(xiàn)的幾起案子涤妒,更是在濱河造成了極大的恐慌,老刑警劉巖赚哗,帶你破解...
    沈念sama閱讀 218,682評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異硅堆,居然都是意外死亡屿储,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評論 3 395
  • 文/潘曉璐 我一進店門渐逃,熙熙樓的掌柜王于貴愁眉苦臉地迎上來够掠,“玉大人,你說我怎么就攤上這事茄菊》杼叮” “怎么了?”我有些...
    開封第一講書人閱讀 165,083評論 0 355
  • 文/不壞的土叔 我叫張陵面殖,是天一觀的道長竖哩。 經(jīng)常有香客問我,道長脊僚,這世上最難降的妖魔是什么相叁? 我笑而不...
    開封第一講書人閱讀 58,763評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮辽幌,結(jié)果婚禮上增淹,老公的妹妹穿的比我還像新娘。我一直安慰自己乌企,他們只是感情好虑润,可當我...
    茶點故事閱讀 67,785評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著加酵,像睡著了一般拳喻。 火紅的嫁衣襯著肌膚如雪哭当。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,624評論 1 305
  • 那天舞蔽,我揣著相機與錄音荣病,去河邊找鬼。 笑死渗柿,一個胖子當著我的面吹牛个盆,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播朵栖,決...
    沈念sama閱讀 40,358評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼颊亮,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了陨溅?” 一聲冷哼從身側(cè)響起终惑,我...
    開封第一講書人閱讀 39,261評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎门扇,沒想到半個月后雹有,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,722評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡臼寄,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年霸奕,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片吉拳。...
    茶點故事閱讀 40,030評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡质帅,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出留攒,到底是詐尸還是另有隱情煤惩,我是刑警寧澤,帶...
    沈念sama閱讀 35,737評論 5 346
  • 正文 年R本政府宣布炼邀,位于F島的核電站魄揉,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏汤善。R本人自食惡果不足惜什猖,卻給世界環(huán)境...
    茶點故事閱讀 41,360評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望红淡。 院中可真熱鬧不狮,春花似錦、人聲如沸在旱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,941評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽桶蝎。三九已至驻仅,卻和暖如春谅畅,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背噪服。 一陣腳步聲響...
    開封第一講書人閱讀 33,057評論 1 270
  • 我被黑心中介騙來泰國打工毡泻, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人粘优。 一個月前我還...
    沈念sama閱讀 48,237評論 3 371
  • 正文 我出身青樓仇味,卻偏偏與公主長得像,于是被迫代替她去往敵國和親雹顺。 傳聞我的和親對象是個殘疾皇子丹墨,可洞房花燭夜當晚...
    茶點故事閱讀 44,976評論 2 355

推薦閱讀更多精彩內(nèi)容