ios开发(二) UIBezierPath贝塞尔曲线常用方法 S
前言
在做的项目里要用到一个扫描识别框,查找资料后发现可以用贝塞尔曲线画一个,在此记录下常用方法,以供后面使用
正文
关于UIBezierPath的一些简单知识储备
UIBezuerPath
封装在UIKit
中,是Core Graphics框架关于path的一个封装,使用此类可以定义简单的形状,比如我们常用到,矩形,圆形,椭圆,弧,或者不规则的多边形。
CAShapeLayer
属于QuartzCore
框架,继承自CALayer
。CAShapeLayer
是在坐标系内绘制贝塞尔曲线的,通过绘制贝塞尔曲线,设置shape(形状)的path(路径),从而绘制各种各样的图形以及不规则图形。因此,使用CAShapeLayer
需要与UIBezierPath
一起使用。
UIBezierPath
类允许你在自定义的 View 中绘制和渲染由直线和曲线组成的路径.。你可以在初始化的时候直接为你的UIBezierPath
指定一个几何图形。
作者:施忆
链接:https://www.jianshu.com/p/139f4fbe7b6b
來源:简书
在iOS开发中,处理的一个又一个
UIView
,实际是在操作CALayer
。那么为什么不直接对CALayer
进行编程呢?那是因为CALayer
继承自NSObject
,主要是用于图层的处理以及动画,而UIView
继承自UIResponder
,可以处理交互事件。
由此,可以认为UIView
就是对CALayer
的一个简单封装,图像绘制、动画都是CALayer
做的。有过开发经验的朋友都知道,苹果在UIView
里面封装了一套动画接口,但是利用这些接口,只是可以做一些简单、不灵活的动画。如果想在底层做一些改变,想实现一些特别的动画,这是学会掌控Core Animation
以外,别无他选。(摘自网络)
- 通俗点就是
UIBezierPath
用来指定绘制图形路径,而CAShapeLayer就是根据路径来绘图的。 -
我们这次要做的一个简单的扫描识别框就是用此方法来画的,效果如图
selectArea.png
UIBezierPath的基本使用
-
let path = UIBezierPath()
创建UIBezierPath
对象 -
path.move(to: CGPoint(x: , y: ))
设置起始点 -
path.addLine(to: CGPoint(x: , y: ))
向目标点画线 let shapeLayer = CAShapeLayer()
-
shapeLayer.path = path.cgPath
存入UIBezierPath的路径准备画图 - 配置工作
shapeLayer.lineWidth = 2 //设置路径线的宽度
shapeLayer.strokeColor = UIColor.blue.cgColor //路径颜色
self.view.layer.addSublayer(shapeLayer)
- 完整代码
let path = UIBezierPath()
path.move(to: CGPoint(x: WIDTH/2-100, y:100+20))
path.addLine(to: CGPoint(x: WIDTH/2-100, y:100))
path.addLine(to: CGPoint(x: WIDTH/2-40, y:100))
path.move(to: CGPoint(x: WIDTH/2+40, y: 100))
path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100))
path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100+20))
path.move(to: CGPoint(x: WIDTH/2+100, y: 100+30))
path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100+50))
path.addLine(to: CGPoint(x: WIDTH/2+40, y: 100+50))
path.move(to: CGPoint(x: WIDTH/2-40, y: 100+50))
path.addLine(to: CGPoint(x: WIDTH/2-100, y: 100+50))
path.addLine(to: CGPoint(x: WIDTH/2-100, y: 100+30))
path.move(to: CGPoint(x: WIDTH/2,y: 115))
path.addLine(to: CGPoint(x: WIDTH/2,y: 135))
path.move(to: CGPoint(x: WIDTH/2-10,y: 125))
path.addLine(to: CGPoint(x: WIDTH/2+10,y: 125))
let shapeLayer = CAShapeLayer()
shapeLayer.path = path.cgPath //存入UIBezierPath的路径
shapeLayer.fillColor = nil //设置填充色
shapeLayer.lineWidth = 2 //设置路径线的宽度
shapeLayer.strokeColor = UIColor.blue.cgColor //路径颜色
self.view.layer.addSublayer(shapeLayer)
- 注意
- 不要忘了将上述代码加入到
viewDidLoad
中
override func viewDidLoad() {
super.viewDidLoad()
// 加入你的画图代码
}
- 和上一篇文章中一样用以下代码获取设备屏幕尺寸
let WIDTH = UIScreen.main.bounds.size.width
let HEIGHT = UIScreen.main.bounds.size.height
总结
UIBezierPath
还可以用来画很多图形,如果不是要定义特定功能的识别框比如扫描二维码,都可以用此方法来画图,可以省事一点,它还可以定义许多简单的形状,比如我们常用到,矩形,圆形,椭圆,弧,或者不规则的多边形。
感兴趣的可以参考这篇教程UIBezierPath教程