[Swift]iOS开发之UIBezierPath画曲线
用过任何绘图软件的朋友对Bezier曲线都不会陌生,就是钢笔工具~下面来看看Bezier曲线的画法,首先定义startPoint、endPoint和controlPoint
let startPoint = CGPointMake(100, 100) let endPoint = CGPointMake(300, 100) let controlPoint = CGPointMake(150, 50)
再定义path和layer
let path = UIBezierPath() let layer = CAShapeLayer()
设置Bezier曲线的起点、终点和控制点
path.moveToPoint(startPoint) path.addQuadCurveToPoint(endPoint, controlPoint: controlPoint)
最后添加layer到view
layer.path = path.CGPath layer.fillColor = UIColor.clearColor().CGColor layer.strokeColor = UIColor.blackColor().CGColor view.layer.addSublayer(layer)
运行我们可以看到⬇️图效果
为了更好地理解Bezier曲线,我们为它添加起点终点和控制点的layer
let slayer = CALayer() let elayer = CALayer() let clayer = CALayer() slayer.frame = CGRectMake(startPoint.x, startPoint.y, 5, 5) elayer.frame = CGRectMake(endPoint.x, endPoint.y, 5, 5) clayer.frame = CGRectMake(controlPoint.x, controlPoint.y, 5, 5) slayer.backgroundColor = UIColor.redColor().CGColor elayer.backgroundColor = UIColor.redColor().CGColor clayer.backgroundColor = UIColor.redColor().CGColor view.layer.addSublayer(slayer) view.layer.addSublayer(elayer) view.layer.addSublayer(clayer)
Run
是不是赶脚很熟悉,就是钢笔工具的赶脚嘛~接下来可以自己调节controlPoint试试~
还可以添加两个控制点,更改fillcolor
clayer2.frame = CGRectMake(controlPoint2.x, controlPoint2.y, 5, 5)