Path

作用:

可以利用一些基本的绘制函数,组合成复杂的图形,保存到path变量里,之后再由canvas.drawPath(path, paint)来进行绘制。

共有参数:
Direction dir:
路径绘制的方向,有两种:顺时针 (CW clockwise) 和逆时针 (CCW counter-clockwise) 。对于普通情况,这个参数填 CW 还是填 CCW 没有影响。它只是在需要填充图形 (Paint.Style 为 FILL 或FILL_AND_STROKE) ,并且图形出现自相交时,用于判断填充范围的。
添加圆形
path.addCircle(300, 300, 200, Path.Direction.CW);
参数:
x, y, radius 这三个参数是圆的基本信息,最后一个参数 dir 是画圆的路径的方向。
示例:
path.addCircle(300, 300, 200, Path.Direction.CW);
canvas.drawPath(path, paint);
解读:
X从0向右偏移300为X轴,Y从0向下偏移300为Y轴,X+Y轴=圆心的位置,200为圆的半径,Path.Direction.CW是画圆的路径的方向。

示例图:

添加椭圆
path.addOval(50, 50, 350, 200, Path.Direction.CW);
示例:
path.addOval(50, 50, 350, 200, Path.Direction.CW);
canvas.drawPath(path, paint);
解读:
以XY(0,0)为起点,X从0向右偏移50为新起点,Y从0向下偏移50为新起点,X从0向右偏移350为终点,Y从0向下偏移200为终点,新起点和终点所得的区域,就是椭圆区域。

 示例图:

添加矩形
path.addRect(100, 100, 500, 500, Path.Direction.CW);
解读:
以XY(0,0)为起点,X从0向右偏移100为新起点,Y从0向下偏移100为新起点,X从0向右偏移500为终点,Y从0向下偏移500为终点,新起点和终点所得的区域,就是矩形区域。

 示例图:

添加圆角矩形
path.addRoundRect(100,100,500,300,50,50, Path.Direction.CW);
解读:
以XY(0,0)为起点,X从0向右偏移100为新起点,Y从0向下偏移100为新起点,X从0向右偏移500为终点,Y从0向下偏移300为终点,新起点和终点所得的区域,就是矩形区域,rx的50是圆角的横向半径,ry的50是圆角的纵向半径。

 示例图:

画线
path.lineTo(100, 100);
path.rLineTo(100, 0);
示例:
paint.setStyle(Paint.Style.STROKE);
path.lineTo(100, 100);
path.rLineTo(100, 0);
path.lineTo(100, 200);
canvas.drawPath(path, paint);
解读:
lineTo(x,y) x,y的计算方式是绝对坐标(0,0开始计算),绘画的起点是上一次绘制的结束坐标;
rLineTo(x,y) x,y的计算方式是相对坐标(上一次绘制结束的xy开始计算),绘画的起点是上一次绘制的结束坐标;
path.lineTo(100, 100);
以XY(0,0)开始计算XY,绘画的起点为0,0(因为第一次画,所以起始值是0,0),X从0向右偏移100点为X的终点,Y从0向下偏移100点为Y的终点,X的终点+Y的终点形成绘画终点,从绘画起点(0,0)到绘画终点(100,100)就是绘制路径,该方法所得的效果就是在起点和终点的端点上画一条线。
path.rLineTo(100, 0);
以XY(100,100)开始计算XY,绘画的起点为100,100(因为上一次绘制的结束坐标在100,100),X从100向右偏移100点为X的终点,Y从100向下偏移0点为Y的终点,X的终点+Y的终点形成绘画的终点,从绘画起点(100,100)到绘画终点(200,100)就是绘制路径,该方法所得的效果就是在起点和终点的端点上画一条线。
path.lineTo(100, 200);
以XY(0,0)开始计算XY,绘画的起点为200,100(因为上一次绘制的结束坐标在200,100),X从0向右偏移100点为X的终点,Y从0向下偏移200点为Y的终点,X的终点+Y的终点形成绘画终点,从绘画起点(200,100)到绘画终点(100,200)就是绘制路径,该方法所得的效果就是在起点和终点的端点上画一条线。

 示例图:

移动绘画的起始位置
path.moveTo(200, 100);
示例:
paint.setStyle(Paint.Style.STROKE);
path.lineTo(100, 100);
path.moveTo(200, 100);
path.lineTo(200, 0);
canvas.drawPath(path, paint);
解读:
先画一条线,然后移动绘画的起始位置到200,100(x,y的计算方式是绝对坐标0,0开始计算)再从绘画起点(200,100)到绘画终点(200,0)的起点和终点的端点上画一条线。

示例图:

在圆形的区域里画弧形
path.arcTo(100, 100, 300, 300, -90, 90, true);
示例:
paint.setStyle(Paint.Style.STROKE);
path.lineTo(100, 100);
path.arcTo(100, 100, 300, 300, -90, 90, true);
canvas.drawPath(path, paint);
解读:
先画一条线,然后以XY(0,0)为起点,X从0向右偏移100为新起点,Y从0向下偏移100为新起点,X从0向右偏移300为终点,Y从0向下偏移300为终点,新起点和终点所得的区域,就是圆形区域,-90是起始绘画位置(X轴从正右方向为0度,旋转-90度的位置开始绘画),90是绘画的角度,true为强制移动到弧形起点(无痕迹)开始绘画,false为一条直线连接到弧形起点(有痕迹)再开始绘画。
多种写法:
path.addArc(100, 100, 300, 300, -90, 90);
解读:
只是一个直接使用了 forceMoveTo = true 的简化版 arcTo()

 示例图:

闭环
path.close();
示例:
paint.setStyle(Style.STROKE);
path.moveTo(100, 100);
path.lineTo(200, 100);
path.lineTo(150, 150);
path.close(); 
解读:
先把起始绘画点移动到100,100,然后X从0向右偏移200点为X的终点,Y从0向下偏移100点为Y的终点,X的终点+Y的终点形成绘画终点,从绘画起点(100,100)到绘画终点(200,100)画一条线;然后X从0向右偏移150点为X的终点,Y从0向下偏移150点为Y的终点,X的终点+Y的终点形成绘画终点,从上次绘画结束的位置到绘画终点(150,150)画一条线;调用close形成闭环(从当前绘画终点150,150到绘画起点100,100绘制一条直线)。

 示例图:

添加另一个 Path
path.addPath(Path path);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值