Swift实时画箭头的实现
iOS上实现画箭头,如果是指定了坐标点,那是很简单的,但如果需要做到实时绘制,就需要计算一下了
需求:
在白板上,根据手势落下点和移动点,实时绘制一条箭头直线(如下图)

实现代码:
/// 获取箭头的点位置
///
/// - Parameters:
/// - fPoint: <#fPoint description#>
/// - tPoint: <#tPoint description#>
/// - Returns: <#return value description#>
func getArrowPoint(fPoint:CGPoint,tPoint:CGPoint) -> (CGPoint,CGPoint,CGPoint) {
var p1 = CGPoint.zero //箭头点1
var p2 = CGPoint.zero //箭头点2
var p3 = CGPoint.zero //箭头最前面点
//假设箭头边长20,箭头是一个等腰三角形
let line = sqrt(pow(fabs(tPoint.x-fPoint.x), )+pow(fabs(tPoint.y-fPoint.y), ))
let arrowH:CGFloat = line> ? : line/
//线与水平方向的夹角
let angle = getAnglesWithThreePoints(p1: fPoint, p2: tPoint, p3: CGPoint(x: fPoint.x, y: tPoint.y))
let _x = CGFloat(fabs(sin(angle)))*arrowH/
let _y = CGFloat(fabs(cos(angle)))*arrowH/
//向右上角、水平向右
if tPoint.x >= fPoint.x && tPoint.y <= fPoint.y{
p1.x = tPoint.x-_x
p1.y = tPoint.y-_y p2.x = tPoint.x+_x
p2.y = tPoint.y+_y p3.x = tPoint.x+_y*
p3.y = tPoint.y-_x* }else if tPoint.x > fPoint.x && tPoint.y > fPoint.y{
//向右下角
p1.x = tPoint.x+_x
p1.y = tPoint.y-_y p2.x = tPoint.x-_x
p2.y = tPoint.y+_y p3.x = tPoint.x+_y*
p3.y = tPoint.y+_x*
}else if tPoint.x < fPoint.x && tPoint.y < fPoint.y{
//向左上角
p1.x = tPoint.x-_x
p1.y = tPoint.y+_y p2.x = tPoint.x+_x
p2.y = tPoint.y-_y p3.x = tPoint.x-_y*
p3.y = tPoint.y-_x* }else if tPoint.x < fPoint.x && tPoint.y >= fPoint.y{
//向左下角,水平向左
p1.x = tPoint.x-_x
p1.y = tPoint.y-_y p2.x = tPoint.x+_x
p2.y = tPoint.y+_y p3.x = tPoint.x-_y*
p3.y = tPoint.y+_x*
}else if fPoint.x==tPoint.x {
//竖直方向
p1.x=tPoint.x-arrowH/
p1.y=tPoint.y
p2.x=tPoint.x+arrowH/
p2.y=tPoint.y
p3.x=tPoint.x
p3.y = tPoint.y>fPoint.y ? tPoint.y+arrowH : tPoint.y-arrowH
} return (p1,p2,p3)
}
其中,获取夹角方法:getAnglesWithThreePoints
/// 计算三点之间的角度
///
/// - Parameters:
/// - p1: 点1
/// - p2: 点2(也是角度所在点)
/// - p3: 点3
/// - Returns: 角度(180度制)
func getAnglesWithThreePoints(p1:CGPoint,p2:CGPoint,p3:CGPoint) -> Double {
//排除特殊情况,三个点一条线
if (p1.x == p2.x && p2.x == p3.x) || ( p1.y == p2.x && p2.x == p3.x){
return
} let a = fabs(p1.x - p2.x)
let b = fabs(p1.y - p2.y)
let c = fabs(p3.x - p2.x)
let d = fabs(p3.y - p2.y) if (a < 1.0 && b < 1.0) || (c < 1.0 && d < 1.0){
return
}
let e = a*c+b*d
let f = sqrt(a*a+b*b)
let g = sqrt(c*c+d*d)
let r = Double(acos(e/(f*g)))
return r //弧度值 // return (180*r/Double.pi) //角度值 }
最后得到三个点,即箭头的三个点坐标

Swift实时画箭头的实现的更多相关文章
- 菱形实现气泡Bubble,菱形画箭头,菱形画三角形
菱形实现气泡Bubble,菱形画箭头,菱形画三角形 >>>>>>>>>>>>>>>>>>&g ...
- android 使用Canvas画箭头
public class MyCanvas extends View{ private Canvas myCanvas; private Paint myPaint=new Pai ...
- SVG 使用marker画箭头(一)
一.使用Marker画箭头 1.定义一个箭头的marker引用 <defs> <marker id='markerArrow' markerWidth='13' markerHeig ...
- WPF画箭头
简介 参考Using WPF to Visualize a Graph with Circular Dependencies的基础上写了一个WPF画箭头的库. 效果图如下: 使用的XAML代码如下: ...
- canvas画箭头demo
效果图: 代码: <!DOCTYPE html> <html> <title>canvas画箭头demo</title> <body> &l ...
- D2D画箭头的例子
原文:D2D画箭头的例子 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/sunnyloves/article/details/50830102 用处 ...
- 如何用CorelDRAW画箭头?
CorelDRAW,简称为cdr,是一款专业的矢量绘图软件,在设计界也是常用的专业设计之一,在日常的设计工作中,我们常常需要绘制一些特殊的图形,比如箭头.很多对cdr不是特别熟练的小伙伴不知道如何用c ...
- 在matlab 画箭头
[转载]在matlab 画箭头 原文地址:在matlab 画箭头作者:纯情小郎君 完整见链接http://www.mathworks.com/matlabcentral/fx_files/14056/ ...
- Workflow:采用坐标变换(移动和旋转)画箭头
背景 流程设计器的连线部分需要画一个箭头代表连接的方向,下图是期望的效果: 刚开始我准备采用三角函数(sin和cos)来计算三角的坐标,实现的过程真不爽(有兴趣的朋友可以试试),就在完工的时候,突然想 ...
随机推荐
- html-盒子模型及pading和margin相关
margin: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- HDU 4635 Strongly connected (强连通分量+缩点)
<题目链接> 题目大意: 给你一张有向图,问在保证该图不能成为强连通图的条件下,最多能够添加几条有向边. 解题分析: 我们从反面思考,在该图是一张有向完全图的情况下,最少删去几条边能够使其 ...
- javascript 词法结构小结
作为一名前端程序员,自然学习了一些框架,但是学的越多越发现自己基础的不足,于是想系统的学习一下js基础,然后把它记录下来. 如其他编程语言一样,词法结构是一门语言的基础,它规定了诸如如何给变量起名字. ...
- 使用element-ui table expand展开行实现手风琴效果
写这篇博客的初衷:官网演示效果为点击toggle,已经展开的项不会因为其他项展开而关闭,所以延伸了下,扩展为手风琴效果. 效果前瞻: 官网table expand地址:http://element-c ...
- linux 学习笔记 APACHE安装总结
#cd /usr/local #mkdir APACHE #tar zxvf /usr/etc/DEV/httpd-2.2.9.tar.gz #mv httpd-2.2.9/* . #rm -rf h ...
- linux 命令基础一。
UNIX是什么 UNIX的定义: UNIX是一个计算机操作系统,一个用来协调.管理和控制计算机硬件和软件资源的控制程序. UNIX操作系统的特点:多用户和多任务多用户表示在同一时刻可以有多个用户同时使 ...
- Spring使用笔记(一)Spring简介
Spring简介 Spring丰富的功能的底层都依赖于它的两个核心特性: 1.依赖注入(dependency injection, DI): 每个对象负责管理与自己协作的对象(即它所依赖的对象)的引用 ...
- 第二章 《C++ Primer Plus》
第二章: 让窗口暂停: cin.get(); 作为接口的函数头: 函数头句法: 函数头描述了函数与调用它的函数之间的接口. int main(); int main(void); return 0; ...
- SpringIOC和DI
1.Spring的概念 Spring的绿草丛(一) Spring轻量级框架, Java EE的春天,当前主流框架目标使现有技术更加易用,推进编码最佳实践内容IoC容器AOP实现数据访问支持简化JDBC ...
- Ubuntu16.04搜狗输入法无法输入中文
搜狗输入法图标显示正常,但是无法输入中文,切换为中文输入时无待选中文,只能输入英文. 这种情况应该是搜狗输入法的配置出现了问题,因为重装输入法时配置文件夹会保留,因此重装无法解决问题. 解决方案: 1 ...