Android 自定义View —— Canvas
上一篇在android 自定義view Paint 里面 說了幾種常見的Point 屬性
繪制圖形的時候下面總有一個canvas ,Canvas 是是畫布 上面可以繪制點,線,正方形,圓,等等,需要和Paint 結合一起
使用,比如畫畫 需要畫筆和紙。
Canvas 常用的方法如下
(1) drawColor(@ColorInt int color) 繪制背景色
(2)drawRGB(int r, int g, int b)? 設置rgb 繪制顏色
(3)drawARGB(int a, int r, int g, int b) 設置argb 繪制顏色
(4)drawPoint(float x, float y, @NonNull Paint paint) 繪制點
(5)drawPoints(@Size(multiple = 2) @NonNull float[] pts, @NonNull Paint paint)? 繪制點
(6)drawLine(float startX, float startY, float stopX, float stopY, @NonNull Paint paint) 繪制線
(7) drawLines(@Size(multiple = 4) @NonNull float[] pts, @NonNull Paint paint) 繪制多條線
(8)?drawRect 繪制方形(可以根據需求繪制長方形,正方形,方法很多參數就不貼出來了)
(9) drawRoundRect 繪制圓角的方形
(10)drawCircle(float cx, float cy, float radius, @NonNull Paint paint) 繪制圓
(11)drawOval 繪制橢圓
(12)drawArc 設置圓弧?
(13)drawText 繪制文字
(14)translate(float dx, float dy) 繪制平移的方法
(15)scale(float sx, float sy) 繪制縮放的方法
(16)rotate(float degrees) 繪制旋轉的方法
(17)drawPath 繪制多種復合路徑 (內容相對比較多一些后期會說道)
?(18)drawBitmap 加載圖片(后面會重新寫一遍bitmap的文章)
1 drawColor? 繪制背景色 說起來這個剛開始接觸android 學view 的時候就感覺好奇,別的都是需要帶Paint 為啥drawColor 就不用帶了呢,總是好奇呢,也不知道到是什么原因,最后自己把他理解為drawColor 只是繪制背景色就是換了一個帶顏色的畫布不需要畫筆的也算是解決了自己的迷惑,最主要的源碼里面里面有畫筆
drawColor? 代碼如下:
@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);// 繪制背景色,個人理解為了直接選了一張帶顏色的紙就不用畫筆了canvas.drawColor(Color.RED);
}
效果圖
2??drawRGB?
canvas.drawRGB(255,0,225);
效果圖?
3?drawARGB
canvas.drawARGB(255, 0, 255, 0);
效果圖
4?drawPoint(float x, float y, @NonNull Paint paint) 繪制點 (這個點方法里面有畫筆注意呢)
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制點canvas.drawPoint(150, 150, paint);
效果圖
5?drawPoints(@Size(multiple = 2) @NonNull float[] pts, @NonNull Paint paint)
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(30);// 繪制點float[] points = {150, 150, 200, 200, 300, 300};canvas.drawPoints(points, paint);
效果圖
6? drawLine(float startX, float startY, float stopX, float stopY, @NonNull Paint paint) 繪制線
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(30);// 繪制實線canvas.drawLine(80, 80, 800, 80, paint);
效果圖
7? drawLines(@Size(multiple = 4) @NonNull float[] pts, @NonNull Paint paint) 繪制多條線
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(30);// 繪制多條實線float[] lines = {80, 80, 800, 80,150,150,800,150,300,300,800,300};canvas.drawLines(lines, paint);
效果圖
8 繪制方形:
寫法1:
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制正方形canvas.drawRect(500,500,800,800,paint);// 繪制長方形canvas.drawRect(100,100,800,400,paint);
寫法2:
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制正方形RectF rect = new RectF(500f, 500f, 800f, 800f);canvas.drawRect(rect, paint);// 繪制長方形rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawRect(rect, paint);
效果圖
我們也可以把setStyle 屬性修改STROKE 顯示邊框效果
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制正方形RectF rect = new RectF(500f, 500f, 800f, 800f);canvas.drawRect(rect, paint);// 繪制長方形rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawRect(rect, paint);
效果圖
、
9? drawRoundRect 繪制圓角的方形:
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制正方形RectF rect = new RectF(500f, 500f, 800f, 800f);canvas.drawRoundRect(rect, 100,200,paint);// 繪制長方形rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawRoundRect(rect,100,200, paint);
效果圖
把setStyle 屬性修改STROKE 顯示邊框效果
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制正方形RectF rect = new RectF(500f, 500f, 800f, 800f);canvas.drawRoundRect(rect, 100,200,paint);// 繪制長方形rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawRoundRect(rect,100,200, paint);
效果圖
10 drawCircle(float cx, float cy, float radius, @NonNull Paint paint) 繪制圓
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制圓canvas.drawCircle(200,200,150,paint);
效果圖
把setStyle 屬性修改STROKE 顯示邊框效果
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制圓canvas.drawCircle(200,200,150,paint);
效果圖
11?drawOval 繪制橢圓?
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制橢圓方法一canvas.drawOval(500f, 500f, 300f, 800f, paint);// 繪制橢圓方法二RectF rect = new RectF();rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawOval(rect, paint);
效果圖
把setStyle 屬性修改STROKE 顯示邊框效果
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);// 繪制橢圓方法一canvas.drawOval(500f, 500f, 300f, 800f, paint);// 繪制橢圓方法二RectF rect = new RectF();rect.left = 100f;rect.top = 100f;rect.right = 800f;rect.bottom = 400f;canvas.drawOval(rect, paint);
效果圖
?
12?drawArc 設置圓弧
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);RectF rect0 = new RectF();rect0.left = 100f;rect0.top = 200f;rect0.right = 300f;rect0.bottom = 400f;canvas.drawArc(rect0, 0, 90, true, paint);RectF rect = new RectF();rect.left = 200f;rect.top = 400f;rect.right = 600f;rect.bottom = 800f;canvas.drawArc(rect, 0, 180, true, paint);RectF rect1 = new RectF();rect1.left = 400f;rect1.top = 800f;rect1.right = 800f;rect1.bottom = 1000f;canvas.drawArc(rect1, 0, 270, true, paint);
效果圖
把setStyle 屬性修改STROKE 顯示邊框效果
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);RectF rect0 = new RectF();rect0.left = 100f;rect0.top = 200f;rect0.right = 300f;rect0.bottom = 400f;canvas.drawArc(rect0, 0, 90, true, paint);RectF rect = new RectF();rect.left = 200f;rect.top = 400f;rect.right = 600f;rect.bottom = 800f;canvas.drawArc(rect, 0, 180, true, paint);RectF rect1 = new RectF();rect1.left = 400f;rect1.top = 800f;rect1.right = 800f;rect1.bottom = 1000f;canvas.drawArc(rect1, 0, 270, true, paint);
效果圖:
?
里面的第三個參數 設置false的時候是不使用中間部分,為了更好的里面可以看下面圖
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);//設置描邊寬度paint.setStrokeWidth(10);RectF rect0 = new RectF();rect0.left = 100f;rect0.top = 200f;rect0.right = 300f;rect0.bottom = 400f;canvas.drawArc(rect0, 0, 90, false, paint);RectF rect = new RectF();rect.left = 200f;rect.top = 400f;rect.right = 600f;rect.bottom = 800f;canvas.drawArc(rect, 0, 180, false, paint);RectF rect1 = new RectF();rect1.left = 400f;rect1.top = 800f;rect1.right = 800f;rect1.bottom = 1000f;canvas.drawArc(rect1, 0, 270, false, paint);
設置false 的 效果圖
13?drawText 繪制文字
// 設置抗鋸齒效果 true是去邊緣會將鋸齒模糊化paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.STROKE);// 設置畫筆的顏色paint.setColor(Color.RED);// 設置字體的大小paint.setTextSize(100f);//設置描邊寬度paint.setStrokeWidth(10f);canvas.drawText("繪制問題",100,100,paint);
?
效果圖
14 translate(float dx, float dy) 繪制平移的方法
paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);paint.setStrokeWidth(10f);// 畫一條線canvas.drawLine(100, 300, 500, 300, paint);// 平移canvas.translate(100, 200);// 平移之后的線canvas.drawLine(100, 300, 500, 300, paint);
15 scale(float sx, float sy) 繪制縮放的方法
paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);paint.setStrokeWidth(10f);// 畫一條線canvas.drawLine(100, 300, 500, 300, paint);// 縮放canvas.scale(2.0f, 2.0f);// 縮放之后的線canvas.drawLine(100, 300, 500, 300, paint);
效果圖
16rotate(float degrees) 繪制旋轉的方法
paint.setAntiAlias(true);// 設置畫筆的style (Paint.Style.FILL填充,Paint.Style.STROKE描邊,Paint.Style.FILL_AND_STROKE填充加描邊 )paint.setStyle(Paint.Style.FILL);// 設置畫筆的顏色paint.setColor(Color.RED);paint.setStrokeWidth(10f);// 畫一條線canvas.drawLine(100, 300, 500, 300, paint);// 縮放canvas.rotate(30);// 旋轉之后的線canvas.drawLine(100, 300, 500, 300, paint);
效果圖
總結
以上是生活随笔為你收集整理的Android 自定义View —— Canvas的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 山东邵广基珍珠长毛兔毛价格是多少钱?
- 下一篇: 卡通猫和老鼠是谁画的呢?