【Android Studio】的矢量绘图【pathData】详解

例子老师：

M13,9
V3.5
L18.5,9
M6,2
C4.89,2 4,2.89 4,4
V20
A2,2 0,0 0,6 22
H18
A2,2 0,0 0,20 20
V8
L14,2
H6
Z
1、M13,9：将当前点移动到坐标 (13, 9)。这是路径的起始点。
2、V3.5：从当前点垂直向下绘制一条直线到坐标 (13, 3.5)。
	// 其中的13使用前一个点的x，向下画是因为3.5<9(上一个坐标的y)
3、L18.5,9：从上一步的终点绘制一条直线到坐标 (18.5, 9)。
4、M6,2：将当前点移动到坐标 (6, 2)。这是一个新的路径的起始点。
5、C4.89,2 4,2.89 4,4：从当前点开始，绘制一条三次贝塞尔曲线，
	控制点1为 (4.89, 2)，控制点2为 (4, 2.89)，终点为 (4, 4)。
6、V20：从上一步的终点垂直向下绘制一条直线到坐标 (4, 20)。
7、A2,2 0,0 0,6 22：绘制一个椭圆弧，参数为 (2, 2)。
	弧的起点为上一步的终点，终点为坐标 (6, 22)。
8、H18：从上一步的终点水平向右绘制一条直线到坐标 (18, 22)。
9、A2,2 0,0 0,20 20：绘制一个椭圆弧，参数为 (2, 2)。
	弧的起点为上一步的终点，终点为坐标 (20, 20)。
10、V8：从上一步的终点垂直向上绘制一条直线到坐标 (20, 8)。
11、L14,2：从上一步的终点绘制一条直线到坐标 (14, 2)。
12、H6：从上一步的终点水平向左绘制一条直线到坐标 (6, 2)。
13、Z：将当前路径闭合，即从当前点绘制一条直线到路径的起始点。

绘制过程：
绘制结果图：

为什么是倒立的？因为真实绘图过程采用的坐标是：
区别就是，y方向倒过来了

一、基础知识：

1、命令和常数：

• 其实你完全可以把命令和函数当成一种东西的两种不同形式：
• 名称+参数
• 这里的参数可有可无

2、绝对坐标和相对坐标：

• 绝对坐标（x，y）等价于（x+0，y+0），可理解成相对于原点（0，0）的相对偏移量。
• 相对坐标（x，y）等价于（x1+x，y1+y），是相对于某点（x1，y1）的相对偏移量。
• 从上面可以看出，不论是绝对还是相对，都需要一个参考量。
• 只不过绝对坐标是一个一开始就默认的参考量，是一个常量。
• 而相对坐标则是在运动过程中看情况选取的一个参考量，是一个变量。
• 什么时候用绝对：
• • 绝对坐标的优势就是非常明确，明确表示该坐标是坐标系上的某点时，能够让你一眼看出位置所在。所以平常我们用绝对坐标比较多，比如（10，10），你就能直接找出坐标是（10，10）的位置。
• 什么时候用相对：
• • 相对坐标的优势是善于变化，比如当你从中国走去美国，当你走到日本的时候你想计算你还有多长路程可以到美国，这时候你只需要计算日本和美国的距离即可。而不需要计算起点到终点。
• • 也就是说，相对坐标可以忽略起点，只考虑当前和未来。

大写表示绝对坐标（相对于原点x=0，y=0），其实就是一种特殊的相对坐标
小写表示相对坐标（相对于上一点x=x1，y=y1的偏移量）

一、落笔命令

命令Mx，y和mx，y（大小写绝对和相对）

• 这两个命令都是【提笔到某点】的意思。
• 大写Mx，y 后面的坐标表示坐标（x，y）是一个绝对坐标
• 小写mx，y 后面的坐标表示坐标（x，y）是一个相对坐标

二、画直线

命令Lx，y和lx，y（大小写绝对和相对）

• 这两个命令都是【从当前笔的位置直线移动到某点（x，y）】的意思

• 注意：很多人都以为这是画直线的，确实有画直线的功能，但是仅仅靠它却不能实现画直线。意思就是说，它只是画直线的多种工具的其中一种而已。所以，其实你理解成【画直线轮廓】还比较恰当。

• 画直线的步骤：

• 1、用L/l命令画直线轮廓（矩形）：M0,0 L5,0 l0,1 L0,1

• 这里需要注意的是，小写的L（l）和数字1非常像，所以一定要区分，一般数字1的左上角都是45°的尖角，而字母l最多是平角。

• 2、给轮廓涂色：
  

• 也就是说，画直线其实是先画矩形，然后再往矩形里面填充颜色，直线的粗细由矩形的宽决定。下面给出在Android Studio中使用的案例：
  

• 最后一个注意点：关于颜色填充的问题，一般而言，都是往一个封闭的图形中填充的。后面实践的时候再详细讲解这个问题。

三、画曲线

1、椭圆轮廓命令：Ax,y 角度 0/1 0/1 x1,y1

如果让你画一个椭圆，你会怎么画？
1、确定起点（从哪一个点开始画）
2、顺时针画还是逆时针画

• 参数解释：加粗部分很重要

• 1、第一个其实不是坐标，而是长半轴x1和短半轴y1的组合。

• 2、0表示不旋转，你还可以根据需要选择90度等等

• 3、1表示长弧度，0表示短弧度，一般用1即可

• 4、0表示左逆时针，1表示左顺时针。

• 5、最后一个坐标是指移动起始坐标，也就是开始画的坐标。起始直接放（1，0）即可，没什么多大用处。

• 最后说明：注意绝对坐标和相对坐标不要搞混了。大写绝对，小写相对。

• 首先你应该先了解椭圆的相关知识：
  大概如下图：

• 如何绘制：
  A/a（坐标1）——0/旋转角度——0/1—— 0/1 ——（1，0）
  如图，下面两个椭圆我们只改变了顺时针和逆时针。

2、一个控制点的曲线命令：Q/qx1,y1 x终,y终

• 两个坐标：控制坐标（x1,y1）终点坐标（x2,y2）
• 关于起始坐标：当前笔的位置
• 如图，其中黄色部分是我加上去的解释。
• 规律：起点或者终点离参考点（即控制坐标）越近，曲线就越直。
• 相反，越远，曲线就越曲。
• 

3、（常用）两个控制点的曲线命令：C/cx1,y1 x2,y2 x终,y终

比如

C
4.89,2 //控制点1（在这个点给一点拉力让直线变弯曲）
4,2.89 //控制点2
4,4// 终点

• 参数的三个坐标：（x1,y1）(x2,y2) (x终,y终)
• 关于起始坐标：当前笔的位置