当前位置: 首页 > news >正文

Android Canvas API 详细说明与示例

1. 基本图形绘制

1.1 画直线

方法签名

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

参数说明

  • startX, startY: 直线起点坐标
  • stopX, stopY: 直线终点坐标
  • paint: 画笔对象,控制线条颜色、粗细等属性

示例

@Override
protected void onDraw(Canvas canvas) {super.onDraw(canvas);Paint paint = new Paint();paint.setColor(Color.RED);paint.setStrokeWidth(5);  // 设置线宽为5像素paint.setAntiAlias(true); // 开启抗锯齿// 从(50,50)到(250,250)画一条红色直线canvas.drawLine(50, 50, 250, 250, paint);
}

1.2 画矩形

方法签名

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

参数说明

  • left, top: 矩形左上角坐标
  • right, bottom: 矩形右下角坐标

示例

Paint paint = new Paint();
paint.setColor(Color.BLUE);
paint.setStyle(Paint.Style.FILL); // 填充模式
paint.setStrokeWidth(3);// 画一个填充的蓝色矩形
canvas.drawRect(100, 100, 300, 300, paint);// 改为描边模式
paint.setStyle(Paint.Style.STROKE); 
paint.setColor(Color.GREEN);// 画一个绿色边框的矩形
canvas.drawRect(150, 150, 350, 350, paint);

1.3 画圆角矩形

方法签名

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

参数说明

  • rect: 矩形区域
  • rx: x方向的圆角半径
  • ry: y方向的圆角半径

示例

Paint paint = new Paint();
paint.setColor(Color.MAGENTA);
paint.setStyle(Paint.Style.FILL_AND_STROKE);RectF rect = new RectF(100, 100, 400, 300);// 画一个圆角矩形,x方向圆角20,y方向圆角30
canvas.drawRoundRect(rect, 20, 30, paint);

1.4 画圆形

方法签名

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

参数说明

  • cx, cy: 圆心坐标
  • radius: 半径

示例

Paint paint = new Paint();
paint.setColor(Color.YELLOW);
paint.setStyle(Paint.Style.FILL);// 在(200,200)处画一个半径100的黄色实心圆
canvas.drawCircle(200, 200, 100, paint);paint.setColor(Color.BLACK);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(5);// 在同一个位置画一个黑色边框圆
canvas.drawCircle(200, 200, 100, paint);

1.5 画三角形

实现方式
使用Path类绘制

示例

Paint paint = new Paint();
paint.setColor(Color.CYAN);
paint.setStyle(Paint.Style.FILL);Path path = new Path();
path.moveTo(200, 100);    // 顶点
path.lineTo(100, 300);    // 左下角
path.lineTo(300, 300);    // 右下角
path.close();             // 闭合路径canvas.drawPath(path, paint);

2. 路径绘制(Path)

2.1 绘制贝塞尔曲线

二次贝塞尔曲线

path.quadTo(float x1, float y1, float x2, float y2)

三次贝塞尔曲线

path.cubicTo(float x1, float y1, float x2, float y2, float x3, float y3)

示例

Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(5);// 二次贝塞尔曲线
Path quadPath = new Path();
quadPath.moveTo(100, 500);
quadPath.quadTo(200, 300, 300, 500);
canvas.drawPath(quadPath, paint);// 三次贝塞尔曲线
Path cubicPath = new Path();
cubicPath.moveTo(400, 500);
cubicPath.cubicTo(450, 400, 550, 600, 600, 500);
canvas.drawPath(cubicPath, paint);

3. 文字绘制

3.1 基本文字绘制

方法签名

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

参数说明

  • x, y: 文字基线(baseline)的起始位置

示例

Paint textPaint = new Paint();
textPaint.setColor(Color.BLACK);
textPaint.setTextSize(50);  // 设置文字大小为50px
textPaint.setAntiAlias(true);// 在(100,100)处绘制文字
canvas.drawText("Hello Canvas", 100, 100, textPaint);

3.2 测量文字宽度

float textWidth = paint.measureText("Hello");

4. 位图绘制

4.1 基本位图绘制

方法签名

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

示例

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.my_image);
canvas.drawBitmap(bitmap, 100, 100, null);

4.2 缩放绘制位图

Rect src = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
RectF dst = new RectF(100, 100, 400, 400);
canvas.drawBitmap(bitmap, src, dst, null);

5. 变换操作

5.1 平移

canvas.save();  // 保存当前状态
canvas.translate(100, 100);  // 向右下平移100px
// 在这里绘制的内容都会应用这个平移
canvas.drawRect(0, 0, 200, 200, paint);  // 实际在(100,100)-(300,300)绘制
canvas.restore();  // 恢复之前的状态

5.2 旋转

canvas.save();
canvas.rotate(45, 200, 200);  // 以(200,200)为中心旋转45度
canvas.drawRect(150, 150, 250, 250, paint);
canvas.restore();

5.3 缩放

canvas.save();
canvas.scale(0.5f, 0.5f, 200, 200);  // 以(200,200)为中心缩小为原来的一半
canvas.drawRect(100, 100, 300, 300, paint);  // 实际绘制为(150,150)-(250,250)
canvas.restore();

6. 图层操作

6.1 创建图层

int layerId = canvas.saveLayer(0, 0, width, height, paint, Canvas.ALL_SAVE_FLAG);
// 在这里绘制的内容会在独立图层上
canvas.drawRect(100, 100, 300, 300, paint);
canvas.restoreToCount(layerId);  // 合并图层

掌握这些API的使用方法和参数含义,可以让你在自定义View时更加得心应手。实际开发中,通常需要组合使用这些API来实现复杂的绘制效果。

http://www.xdnf.cn/news/388729.html

相关文章:

  • python【扩展库】websockets
  • idea中的vcs不见了,如何解决
  • 探秘 DeerFlow:字节跳动开源的科研创作魔法盒!
  • 温湿度传感器SHT4X
  • 【C++】AVL树实现
  • 害怕和别人发生冲突怎么办? --deepseek
  • [特殊字符] 免税商品优选购物商城系统 | Java + SpringBoot + Vue | 前后端分离实战项目分享
  • 线程的一些事(2)
  • 拍摄学习笔记【前期】(一)曝光
  • SQL 数据库监控:SQL语句监控工具与实践案例
  • 【Redis】Redis的主从复制
  • Linux常见指令解析(三)
  • jenkins built-in节点如何删除
  • TeledyneLeCroy在OFC2025 EA展台上展示了其400G/800G的全包围的测试解决方案,满足了UEC联盟和UALINK联盟的技术需求
  • 【25软考网工】第六章(3)数字签名和数字证书
  • opencv关键点检测
  • C语音学习---函数指针
  • Redis爆肝总结
  • 【嵌入式DIY实例-Arduino篇】-DIY遥控手柄
  • IC ATE集成电路测试学习——电流测试的原理和方法
  • 数据库与SQL核心技术解析:从基础到JDBC编程实战
  • 设计模式系列(1):总览与引导
  • NX989NY104美光科技芯片NY109NY113
  • LVGL(lv_btnmatrix矩阵按钮)
  • Babel 基础使用指南:从安装到编译的完整流程
  • MySQL主从复制
  • CacheBackEmbedding 组件的运行流程和使用注意事项
  • 使用 SHAP 进行特征交互检测:揭示变量之间的复杂依赖关系
  • 实战项目6(09)
  • 【计算机视觉】OpenCV实战项目:Text-Extraction-Table-Image:基于OpenCV与OCR的表格图像文本提取系统深度解析