基础方法和参数介绍

save()

保存当前Canvas的坐标系状态，
save() 方法调用之后，方便Canvas对某些视图的平移、放缩、旋转、裁剪等操作，因为在这些操作执行完毕，可以用 restore() 方法进行复位。

试想如果你不保存Canvas的状态，在进行平移、放缩、旋转、裁剪等操作后，你连一个视图的基本位置绘制起来都会很麻烦，为什么？因为Canvas坐标系可能已近旋转了，你找不到X和Y轴的正方向了。你必须把绘制的视图本身进行同样的平移、放缩、旋转、裁剪等操作后，才能找到Canvas坐标系的正方向。
所以，对某些视图的平移、放缩、旋转、裁剪等操作前，保存当前Canvas的坐标系状态就很有必要。

restore()

恢复save()保存的Canvas的坐标系状态

注：其实不只是坐标系状态o，不过如此形容感觉能容易理解，Canvas.save()保存的除了坐标系状态，还有画布和其他视图的状态，都需要复原。

void enableZ()

void disableZ()

绘制方法及参数介绍

1. drawARGB 画布颜色设置

void drawARGB(int a, int r, int g, int b)

用ARGB颜色填充画布的背景

@params a 指的是透明度，颜色取值范围是（0…255），数值是0，表示完全不可见，数值是255，完全可见
@params r 指的是红色，颜色取值范围是（0…255）
@params g 指的是绿色，颜色取值范围是（0…255）
@params b 指的是蓝色，颜色取值范围是（0…255）

void drawRGB(int r, int g, int b)

@params r 指的是红色，颜色取值范围是（0…255）
@params g 指的是绿色，颜色取值范围是（0…255）
@params b 指的是蓝色，颜色取值范围是（0…255）

2. drawText 绘制文字

void drawText(@NonNull char[] text, int index, int count, float x, float y,@NonNull Paint paint)

@params char[] text，是文字内容，类型是 char[] ，可以 string.toCharArray() 获取
@params index 指的是 char[] 中的起始位置，从第几个字符开始写，初始位置是0
@params count 指的是从起始位置开始，往后写，一共写几个字符，包含起始位置的字符
@params x 指的是文本x轴起始位置，文本相对屏幕原点x方向距离
@params y 指的是文本的 baseline相对屏幕原点 y方向距离
@params paint ，画笔

void drawText(@NonNull String text, float x, float y, @NonNull Paint paint)

@params text，需要写的文本内容
@params x 指的是文本x轴起始位置，文本相对屏幕原点x方向距离
@params y 指的是文本的 baseline相对屏幕原点 y方向距离
@params paint ，画笔

void drawText(@NonNull String text, int start, int end, float x, float y,@NonNull Paint paint)

@params text，需要写的文本内容
@params start 指的是写text 的起始位置，从第几位开始写，初始位置是0
@params end 指的是写text 中的终止位置，终止位置不写，所以写的长度= end-start
@params x 指的是文本x轴起始位置，文本相对屏幕原点x方向距离
@params y 指的是文本的 baseline相对屏幕原点 y方向距离
@params paint ，画笔

void drawText(@NonNull CharSequence text, int start, int end, float x, float y,@NonNull Paint paint)

@params CharSequence text，需要写的文本内容，类型区别于String，CharSequence是可读写序列
@params start 指的是写text 的起始位置，从第几位开始写，初始位置是0
@params end 指的是写text 中的终止位置，终止位置不写，所以写的长度= end-start
@params x 指的是文本x轴起始位置，文本相对屏幕原点x方向距离
@params y 指的是文本的 baseline相对屏幕原点 y方向距离
@params paint ，画笔

基准线

https://www.cnblogs.com/zhengjunfei/p/7872112.html

3. drawPosText 、drawTextRun 绘制文字

drawPosText 过期不候
drawTextRun听过对中国人没啥用

4. drawTextOnPath 沿着路径绘制文字

void drawTextOnPath(@NonNull char[] text, int index, int count, @NonNull Path path,float hOffset, float vOffset, @NonNull Paint paint)

@params char[] text 文字内容，类型是 char[] ，可以 string.toCharArray() 获取
@params index 指的是 char[] 中的起始位置，从第几个字符开始写，初始位置是0
@params count 指的是从起始位置开始，往后写，一共写几个字符，包含起始位置的字符
@params path Path可以看成复杂图形，可以代表所有
@params hOffset 沿路径添加到文本起始位置的距离
@params vOffset 上面(-)或下面(+)的距离用于定位文本的路径
@params paint 画笔

void drawTextOnPath(@NonNull String text, @NonNull Path path, float hOffset,float vOffset, @NonNull Paint paint)

@params text 文字内容
@params path Path可以看成复杂图形，可以代表所有
@params hOffset 沿路径添加到文本起始位置的距离
@params vOffset 上面(-)或下面(+)的距离用于定位文本的路径
@params paint 画笔

例

                Path path1 = new Path();path1.lineTo(400, 400);RectF rectF32 = new RectF(50, 200, 350, 400);path1.arcTo(rectF32, 0, 320, false);canvas.drawPath(path1, paintText);canvas.drawTextOnPath("ahahhahaha,so ku a !", path1, 50, 50, paintText);

5. drawPoint 点绘制

void drawPoint(float x, float y, @NonNull Paint paint)

@params x 绘制点的X坐标
@params x 绘制点的Y坐标
@params paint 画笔

void drawPoints(@Size(multiple = 2) @NonNull float[] pts, @NonNull Paint paint)

@params pts 点集合，样式为｛x1,y1,x2,y2,x3,y3,…｝
@params paint 画笔

void drawPoints(@Size(multiple = 2) float[] pts, int offset, int count,@NonNull Paint paint)

@params pts 点集合，样式为｛x1,y1,x2,y2,x3,y3,…｝
@params offset 跳过集合中的数值的个数，注意不是点的个数，因为一个点是两个值
@params count 参与绘制的数值的个数，指pts[]里人数值个数，而不是点的个数，因为一个点是两个数值
@params paint 画笔

例

                canvas.drawPoint(150, 150, paintText);paintText.setColor(Color.RED);float[] pos = {100, 100, 50, 50, 50, 200, 200, 200};canvas.drawPoints(pos, paintText);

                canvas.drawPoint(150, 150, paintText);paintText.setColor(Color.RED);float[] pos = {100, 100, 50, 50, 50, 200, 200, 200};canvas.drawPoints(pos, 1,2,paintText );

线宽必须设置，如果不设置线宽，无法绘制点

 paint.setStrokeWidth(50 * density);

端点（落笔点）形状

paintText.setStrokeCap(Paint.Cap.BUTT);//正方形
//Paint.Cap.ROUND 圆形
//Paint.Cap.SQUARE 正方形

6. drawLine 画线

void drawLine(float startX, float startY, float stopX, float stopY,@NonNull Paint paint)

@params startX
@params startY
@params stopX
@params stopY
@params paint 画笔

void drawLines(@Size(multiple = 4) @NonNull float[] pts, @NonNull Paint paint)

@params pts 点集合，样式为｛x1,y1,x2,y2,x3,y3,…｝最少四个值，两个值是一个点，两个点连成线
@params paint 画笔

void drawLines(@Size(multiple = 4) @NonNull float[] pts, int offset, int count,@NonNull Paint paint)

@params pts 点集合，样式为｛x1,y1,x2,y2,x3,y3,…｝最少四个值，两个值是一个点，两个点连成线
@params offset 跳过集合中的数值的个数，注意不是点的个数，因为一个点是两个值
@params count 参与绘制的数值的个数，指pts[]里人数值个数，而不是点的个数，因为一个点是两个数值
@params paint 画笔

例

                canvas.drawLine(50,50,100,100,paintText);float [] pos2 = {150,150,200,200,300,50,50,100};canvas.drawLines(pos2,1,4,paintText);

7. drawCircle 绘制圆和圆环

void drawCircle(float cx, float cy, float radius, @NonNull Paint paint)

@params cx
@params cy
@params radius
@params paint 画笔

8. drawRect 绘制矩形

void drawRect(@NonNull RectF rect, @NonNull Paint paint)

@params RectF rect 绘制矩形的参数
@params paint 画笔

void drawRect(@NonNull Rect r, @NonNull Paint paint)

@params Rect rect 绘制矩形的参数
@params paint 画笔

void drawRect(float left, float top, float right, float bottom, @NonNull Paint paint)

@params left
@params top
@params right
@params bottom
@params paint 画笔

例

                final int EXIT = 150;Rect rect = new Rect(50, 100, 100, 150);canvas.drawRect(rect, paintText);RectF rectF3 = new RectF(EXIT + 50, EXIT + 100, EXIT + 100, EXIT + 150);canvas.drawRect(rectF3, paintText);

9. drawOval 绘制椭圆

void drawOval(@NonNull RectF oval, @NonNull Paint paint)

@params RectF oval 参数
@params paint 画笔

void drawOval(float left, float top, float right, float bottom, @NonNull Paint paint)

@params left
@params top
@params right
@params bottom
@params paint 画笔

10. drawArc 弧面和弧线

void drawArc(@NonNull RectF oval, float startAngle, float sweepAngle, boolean useCenter,@NonNull Paint paint)

@params RectF oval 参数
@params startAngle 起始角度
@params sweepAngle 旋转角度，旋转角度为正，会顺时针绘制；旋转角度为负，会逆时针绘制
@params useCenter 是否显示半径连线，true表示显示圆弧与圆心的半径连线，false表示不显示
@params paint 画笔

void drawArc(float left, float top, float right, float bottom, float startAngle,float sweepAngle, boolean useCenter, @NonNull Paint paint)

@params left
@params top
@params right
@params bottom
@params startAngle 起始角度
@params sweepAngle 旋转角度，旋转角度为正，会顺时针绘制；旋转角度为负，会逆时针绘制
@params useCenter 是否显示半径连线，true表示显示圆弧与圆心的半径连线，false表示不显示
@params paint 画笔

例

图1 useCenter = false ;Paint.Style.STROKE

图2 useCenter = true;Paint.Style.STROKE

                RectF rectF3 = new RectF(50,250,500,200);canvas.drawOval(rectF3,paintText);paintText.setStyle(Paint.Style.STROKE);RectF rectF321 = new RectF(50,300,500,600);canvas.drawArc(rectF321,30,300,true,paintText);

11. drawBitmap 绘图

void drawBitmap(@NonNull Bitmap bitmap, float left, float top, @Nullable Paint paint)

@params bitmap bitmap对象
@params left 左侧起点
@params top 顶部起点
@params paint 画笔

例

                Bitmap bitmap = decodeResource(getResources(), R.mipmap.timg);canvas.drawBitmap(bitmap, 50, 50, paintText);Bitmap bitmap2 = decodeResource(getResources(), R.mipmap.lu4);canvas.drawBitmap(bitmap2, 350, 150, paintText);

图片没有压缩，只是加载出部分区域。

void drawBitmap(@NonNull Bitmap bitmap, @Nullable Rect src, @NonNull RectF dst,@Nullable Paint paint)

@params bitmap bitmap对象
@params Rect src 对原图片的裁剪区域。null 或者 bitmap.getWidth/bitmap.getHeight 表示不裁剪。 Rect src 内的参数数值应该是bitmap加载的尺寸，不是图片原尺寸哦，坐标的原点是本身（0,0），因为是相对于图片本身的位置
@params RectF dst 将裁剪完的图片绘制到View控件上的区域。图片小于指定区域-放大；图片大于指定区域-缩小。指定区域也是和bitmap的尺寸相关，而不是图片原尺寸哦
@params paint 画笔

例

                Bitmap bitmap = decodeResource(getResources(), R.mipmap.timg);canvas.drawBitmap(bitmap, 50, 50, paintText);Bitmap bitmap2 = decodeResource(getResources(), R.mipmap.lu4);LogUtils.i(TAG, "输出 bitmap2 ====" + "\n" +"getWidth ===" + bitmap2.getWidth() + "\n" +"getHeight ===" + bitmap2.getHeight() + "\n");Rect rect = new Rect(0, 0, bitmap2.getWidth(), bitmap2.getHeight());//以图片为坐标系RectF rectF4 = new RectF(350, 150, 350 + bitmap2.getWidth(), 150 + bitmap2.getHeight() / 2);//以坐标原点为坐标系canvas.drawBitmap(bitmap2, rect, rectF4, paintText);

void drawBitmap(@NonNull Bitmap bitmap, @Nullable Rect src, @NonNull Rect dst,@Nullable Paint paint)

@params bitmap bitmap对象
@params Rect src 对原图片的裁剪区域。null 或者 bitmap.getWidth/bitmap.getHeight 表示不裁剪。 Rect src 内的参数数值应该是bitmap加载的尺寸，不是图片原尺寸哦，坐标的原点是本身（0,0），因为是相对于图片本身的位置
@params Rect dst 将裁剪完的图片绘制到View控件上的区域。图片小于指定区域-放大；图片大于指定区域-缩小。指定区域也是和bitmap的尺寸相关，而不是图片原尺寸哦
@params paint 画笔

注意：和上面的方法实现的是同样的效果，见上。

void drawBitmap(@NonNull int[] colors, int offset, int stride, float x, float y, int width, int height, boolean hasAlpha, @Nullable Paint paint) 过期

void drawBitmap(@NonNull int[] colors, int offset, int stride, int x, int y,int width, int height, boolean hasAlpha, @Nullable Paint paint) 过期

void drawBitmap(@NonNull Bitmap bitmap, @NonNull Matrix matrix, @Nullable Paint paint)

@params bitmap bitmap对象
@params Matrix matrix 矩阵 最根本的作用就是坐标转换 -

• 平移(Translate)
• 缩放(Scale)
• 旋转(Rotate)
• 倾斜(Skew)

@params paint 画笔

例

待续

void drawBitmapMesh(@NonNull Bitmap bitmap, int meshWidth, int meshHeight,@NonNull float[] verts, int vertOffset, @Nullable int[] colors, int colorOffset,@Nullable Paint paint)

@params bitmap
@params meshWidth
@params meshHeight
@params verts
@params vertOffset
@params colors
@params colorOffset
@params paint

12. drawRoundRect 圆角矩形

void drawRoundRect(@NonNull RectF rect, float rx, float ry, @NonNull Paint paint)

@params rect
@params rx 椭圆圆角的横轴半径
@params ry 椭圆圆角的纵轴半径
@params paint 画笔

void drawRoundRect(float left, float top, float right, float bottom, float rx, float ry,@NonNull Paint paint)

@params left
@params top
@params right
@params bottom
@params rx 椭圆圆角的横轴半径
@params ry 椭圆圆角的纵轴半径
@params paint 画笔

13. drawDoubleRoundRect 双框圆角矩形

void drawDoubleRoundRect(@NonNull RectF outer, float outerRx, float outerRy,@NonNull RectF inner, float innerRx, float innerRy, @NonNull Paint paint)

@params RectF outer 外矩形
@params outerRx 外矩形X轴圆角
@params outerRy 外矩形Y轴圆角
@params RectF inner 内矩形
@params innerRx 内矩形X轴圆角
@params innerRy 内矩形Y轴圆角
@params paint 画笔

例

                RectF rectF41 = new RectF(30,30,330,330);RectF rectF412 = new RectF(40,40,200,200);canvas.drawDoubleRoundRect(rectF41,30,30,rectF412,10,10,paintText);

void drawDoubleRoundRect(@NonNull RectF outer, @NonNull float[] outerRadii,@NonNull RectF inner, @NonNull float[] innerRadii, @NonNull Paint paint)

@params RectF outer
@params float[] outerRadii
@params RectF inner
@params float[] innerRadii
@params paint

14. drawColor 画布颜色设置

void drawColor(@ColorInt int color)

@params @ColorInt int color表明该参数、变量或者函数返回值应该是一个颜色值而不是颜色资源引用，例如应该是一个 AARRGGBB 的整数值

设置Int类型颜色值得方法有很多种：

                canvas.drawColor(0xFFFFB6C1);//直接写值canvas.drawColor(Color.argb(255, 255, 255, 255));//ARGB转Intcanvas.drawColor(getResources().getColor(R.color.colorPrimary));//获取color.xml的颜色资源canvas.drawColor(Color.RED);//系统APIcanvas.drawColor(Color.parseColor("#FFB6C1"));//#FFB6C1转成Int

void drawColor(@ColorLong long color)

@params @ColorLong int color

void drawColor(@ColorInt int color, @NonNull PorterDuff.Mode mode)

@params @ColorInt int color
@params PorterDuff.Mode mode

void drawColor(@ColorInt int color, @NonNull BlendMode mode)

@params @ColorInt int color
@params BlendMode mode

void drawColor(@ColorLong long color, @NonNull BlendMode mode)

@params @ColorLong int color
@params BlendMode mode

15. drawPaint 画布颜色设置

void drawPaint(@NonNull Paint paint)

@params Paint paint 跟随画笔颜色，为画布设置背景色

16. drawPicture 绘制矢量图

转：https://blog.csdn.net/u013135085/article/details/81216663

用于：在绘制图片之前保存Canvas状态，绘制完成之后回复Canvas。

介绍：Picture和录像功能是类似的，只不过Picture录的是Canvas中绘制的内容。我们把Canvas绘制点，线，矩形等诸多操作用Picture录制下来，下次需要的时候拿来就能用，使用Picture相比于再次调用绘图API，开销是比较小的，也就是说对于重复的操作可以更加效率。

void drawPicture(@NonNull Picture picture)

@params Picture picture

void drawPicture(@NonNull Picture picture, @NonNull RectF dst)

@params Picture picture
@params RectF dst 在指定区域内绘制图片，当图片大小不匹配时进行适当的缩放

void drawPicture(@NonNull Picture picture, @NonNull Rect dst)

@params Picture picture
@params Rect dst 在指定区域内绘制图片，当图片大小不匹配时进行适当的缩放

例

初始化 picture

                Canvas canvasSave = picture.beginRecording(500, 500); //启动Bitmap bitmap3 = decodeResource(getResources(), R.mipmap.y1);Matrix matrix3 = new Matrix();matrix3.postTranslate(150, 150);matrix3.postScale(2, 2);canvasSave.drawBitmap(bitmap3, matrix3, paintText);//记录picture.endRecording();//停止

在需要的位置

//                canvas.drawPicture(picture);picture.draw(canvas);

17. drawRenderNode

void drawRenderNode(@NonNull RenderNode renderNode)

@params RenderNode renderNode

18. drawVertices

void drawVertices(@NonNull VertexMode mode, int vertexCount, @NonNull float[] verts,int vertOffset, @Nullable float[] texs, int texOffset, @Nullable int[] colors,int colorOffset, @Nullable short[] indices, int indexOffset, int indexCount,@NonNull Paint paint)

参数转：https://bbs.csdn.net/topics/390871706

@params VertexMode mode 顶点类型 比如他是三角形（连续3个顶点）或者 四边形 （连续4个顶点）等等
@params vertexCount 顶点数 总共有多少个顶点绘制
@params float[] verts 顶点数组 [0,0,0,1,1,0,…] 前面有xy 3组 如果是类型是三角形 他就构成一个三角形的绘制基元，往后类推
@params int vertOffset顶点数据 起始位置 可能全部绘制，也可能只绘制部分顶点。与 vertexCount 配置使用 一般为0
@params float[] texs纹理数组 就是对图片等进行采样，然后去渲染顶点。（这个比较复杂，需要了解下 比如opengl渲染原理）
@params int texOffset同上offset 就是偏移量
@params int[] colors颜色数组 直接用颜色渲染顶点
@params int colorOffset同上offset 就是偏移量
@params short[] indices顶点索引 可能只绘制部分顶点 这个就是存放那些顶点的index ， 即verts[index]
@params indexOffset同上offset 就是偏移量
@params indexCount绘制多少个索引点
@params paint

Canvas 绘制方法过一遍相关推荐

1. 小猿圈html5教程之canvas绘制线段方法

   HTML5现在是时下较火的编程语言之一,但是对于怎么学习很多朋友都是不了解的,不知道从何处下手,针对以上内容小猿圈web前端讲师每天会分享一个web前端知识,希望对你的前端学习有一定的帮助,今天分享的 ...

2. 用html5做一条线,使用HTML5 canvas绘制线条的方法

   使用HTML5 canvas绘制线条的方法 发布时间:2020-08-29 11:24:23 来源:亿速云 阅读:96 作者:小新 这篇文章主要介绍了使用HTML5 canvas绘制线条的方法,具有一 ...

3. html页面画一个矩形,使用HTML5 canvas绘制一个矩形的方法

   使用HTML5 canvas绘制一个矩形的方法 发布时间:2020-08-29 11:23:12 来源:亿速云 阅读:102 作者:小新 这篇文章将为大家详细讲解有关使用HTML5 canvas绘制一 ...

4. h5的横线_使用HTML5 Canvas绘制直线或折线等线条的方法讲解

   HTML5 Canvas基本概念讲解html5,这个应该就不需要多作介绍了,只要是开发人员应该都不会陌生.html5是「新兴」的网页技术标准,目前,除IE8及其以下版本的IE浏览器之外,几乎所有主流浏 ...

5. 微信小程序新版canvas绘制图片方法

   今天在做项目使用到了canvas绘制二维码,发现以前的方法被弃用了. wxml: <canvas type="2d" id="myCanvas" styl ...

6. canvas绘制圆形马赛克方法二

   因某些项目需求:必须先绘制整出整个图片在打马赛克,"canvas绘制圆形马赛克方法一"中方式不能满足,故用以下方式实现: 方法简介: 先绘制出整个图片在画布a上,在将马赛克数据co ...

7. 用html制作阴影效果,使用HTML5 Canvas绘制阴影效果的方法

   这篇文章主要介绍了使用HTML5 Canvas绘制阴影效果的方法,包括一个3D拉影 边缘模糊效果文字的编写例子,在阴影效果的利用上进一步深入,需要的朋友可以参考下 创建阴影效果需要操作以下4个属性: ...

8. 如何在html5中实现多圆,JavaScript与html5如何实现canvas绘制圆形图案的方法介绍

   这篇文章主要介绍了js+html5实现canvas绘制圆形图案的方法,涉及html5图形绘制的基础技巧,需要的朋友可以参考下 本文实例讲述了js+html5实现canvas绘制圆形图案的方法.分享给大 ...

9. 史上最详细的使用canvas绘制五星红旗的方法

   史上最详细的使用canvas绘制五角星的方法 昨天我们在课堂上讲到了HTML5中的canvas标签,canvas标签用于绘制图像(通过脚本,通常是 JavaScript).当天布置的作业就是利用can ...

最新文章

1. 《windows核心编程系列》二谈谈ANSI和Unicode字符集
2. Grape Api 笔记
3. 不可错过的2019秋招CV岗心得！原来拿offer也是有套路的
4. nonatomic与atomic的区别与作用
5. 第八天2017/04/17（3、C++的几个语法）
6. 在定义SharePoint列表的SPD数据视图的时候需要注意的问题
7. QT中的事件传递顺序小论
8. 第三次学JAVA再学不好就吃翔(part49)--String类的获取功能
9. mongo 记得开启验证 auth = true
10. php array_search多条件,php使用array_search与array_column函数实现二维数组内元素查找...
11. 萌新的Python练习菜鸟100例（十）暂停一秒输出，并格式化输出当前时间
12. Linux 命令（56）—— telnet 命令
13. GdiPlus[15]: IGPLinearGradientBrush 之 GammaCorrection
14. Machine Learning - X. Advice for Applying Machine Learning机器学习算法的诊断和改进 (Week 6)
15. 【当心】看房没戴头盔，损失二十万 。。。
16. matlab2c使用c++实现matlab函数系列教程-pascal函数
17. keras深度学习之猫狗分类三（特征提取）
18. 聊天室后台 java php_PHP实现简单聊天室(附源码)
19. hello.java_hello　java　！
20. VirtualBox安装黑苹果

热门文章

1. CRMEB全开源Java版微信小程序商城，附源码
2. 微博插件-微博图片全显示（页面样式本人优化版）
3. adb 出现多个设备情况操作解决
4. Vue微信网页开发，输入法顶开一部分屏幕的解决办法
5. excel怎么设置自动计算_中建整理：160个Excel自动计算表，计算快效率高数据精准，超实用...
6. MySQL-视图-触发器-事务-存储过程-函数-流程控制-索引与慢查询优化-06
7. TIA博途WINCC中如何获取当前画面编号并发送给PLC？
8. ubuntu 安装wifi驱动（Device-c822)
9. spring boot静态资源文件的访问以及自定义
10. 谷歌浏览器账号密码自动填充和明文显示问题