D4-Android绘图之和我一起画箭头

零、前言

画箭头?逗我吧，箭头有什么好画的，其中还是有东西讲的，算是LogicCanvas向量绘制的引入吧 数学老师：“安逸的你们，是否已经忘记了曾经被向量支配的恐惧?”(开玩笑的) 案例代码在自定义控件时的Ondraw里 绘图部分基于我的LogicCanvas绘图库：基础使用在此， 喜欢的话可以到github上看看，顺便给个star

效果图

效果图.png 效果图

---

画线

1.前期准备：为了方便查看先绘制网格和坐标系

Pos coo = v2(500, 800);//定义坐标系位置 //绘制网格 CanvasUtils.drawGrid(getContext(), 50, canvas); //绘制坐标系 CanvasUtils.drawCoord(getContext(), coo, 50, canvas);

2.画一个给定点的向量：以原点为起点

//基于坐标绘制a向量 Shape a = new ShapeLine().v(100f,100f).coo(coo).b(5f).ss(Color.GRAY); painter.draw(a); 画一个给定点的向量.png

你也许会说:老子瓜子都准备好了，就给我看这个?分明就是条线，扯什么向量，吓老子一跳。用安卓元素的canvas也能666的画出来------别急别急

3.画一个给信息的向量：比如--一条与X轴夹角60°，长300px向量

Shape a = new ShapeLine().ang(60f).c(300f).coo(coo).b(5f).ss(Color.GRAY); painter.draw(a); 画一个给信息的向量.png

你也许会说:恩?有点意思，明明是直线，你偏说是向量干嘛----

---

二、画箭头：

基于上面两点画个箭头应该不在话下吧，封个方法出来，专门给向量加箭头

/** * 给向量加个箭头...纯属好看 * * @param shapeL 直线 */ public void cap(ShapeLine shapeL) { Pos posOfCap = shapeL.mv.add(shapeL.mp);//箭头向量的起点 ShapeLine cap = (ShapeLine) new ShapeLine()//一侧箭头 .c(30f).ang(shapeL.mang + 155) .p(posOfCap).coo(shapeL.mcoo).b(3f).ss(Color.BLUE); ShapeLine cap2 = cap.deepClone().ang(shapeL.mang - 155);//另一侧箭头 draw(cap, cap2);//绘制箭头 }

使用：

cap(a); 箭头.png

你也许会说:好吧，你说向量就向量吧，箭头画完了，老子走了-----等一下，好戏还没开演呢。

三、向量的简单操作

之所以说是向量，不是因为它的名字叫向量，而是模仿了很多向量向量相关的操作

准备工作：

为了避免new很多点，采用原型模式(已在Pos里添加clone函数)，下面是由一个点克隆点的方法。 直线采用深克隆，避免new

protected Pos pos = new Pos(0,0);//准备一个点 protected ShapeLine sl = new ShapeLine();//准备一个线 /** * 形成向量 * * @param x X 坐标 * @param y Y 坐标 * @return 向量 */ public Pos v2(float x, float y) { return pos.clone(x, y); }

使用：

Pos pA=v2(100,100);//就拷贝了一个点，并赋值为100,100 ShapeLine a = (ShapeLine) sl.deepClone().v(pA).coo(coo).b(5f).ss(Color.GRAY); painter.draw(a).cap(a); 源向量.png

1.重定义长度：resize()

pA.resize(300); 重定义长度.png

---

2.取反向量:ref()

pA = pA.ref(); 取反.png

---

3.X取反向量:refX()

pA = pA.refX(); X取反向量.png

---

4.Y取反向量:refY()

pA = pA.refY(); Y取反向量.png

---

5.置为0向量:release()

pA.release(); 置为0向量.png

6.向量加法演示：

//向量 Pos pA = v2(100f, 100f); Pos pB = v2(-100f, 100f); //形状 ShapeLine a = (ShapeLine) sl.deepClone().v(pA).coo(coo).b(5f).ss(Color.RED); ShapeLine b = a.deepClone().v(pB); ShapeLine c = a.deepClone().v(pA.add(pB)); //绘制 painter.draw(a).cap(a); painter.draw(b).cap(b); painter.draw(c).cap(c); 向量.png

为了直观，现在改一下B

Pos pB = v2(400f, 0f); 修改B.png

是不是回忆起力的合成与分解了，现在说是向量，行了吧 加两条虚线，美化一下

ShapeLine AC = (ShapeLine) sl.deepClone().ps(pA, pA.add(pB)).coo(coo).b(4).de(Cons.DOT_LINE_8).ss(Color.BLACK); ShapeLine BC = AC.deepClone().ps(pB, pA.add(pB)); painter.draw(AC, BC); 美化.png

---

后记、

1.声明：

[1]本文由张风捷特烈原创,转载请注明 [2]欢迎广大编程爱好者共同交流 [3]个人能力有限，如有不正之处欢迎大家批评指证，必定虚心改正 [4]你的喜欢与支持将是我最大的动力

2.连接传送门：

更多安卓技术欢迎访问:安卓技术栈 我的github地址：欢迎star 简书首发，腾讯云+社区同步更新 张风捷特烈个人网站，编程笔记请访问：http://www.toly1994.com

3.联系我

QQ:1981462002 邮箱：1981462002@qq.com 微信：zdl1994328

4.欢迎关注我的微信公众号，最新精彩文章，及时送达：

公众号.jpg

转载于:https://www.cnblogs.com/toly-top/p/9781898.html

相关资源：JAVA上百实例源码以及开源项目