您的位置:首页 > 移动开发 > Swift

swift 绘制、动画基础 (CAShapeLayer、CABasicAnimation)

2017-03-07 15:13 621 查看
//MARK: 绘制虚线
let layer0 = CAShapeLayer()
layer0.strokeColor = UIColor.green.cgColor
layer0.lineWidth = 0.5
//线段宽度10 间距10
let arr :NSArray = NSArray(array: [10,10])
//基于线段的起始位置
layer0.lineDashPhase = 0
layer0.lineDashPattern = arr as? [NSNumber]
self.view.layer.addSublayer(layer0)
//路径
let mdotteShapePath = CGMutablePath()
mdotteShapePath.move(to: CGPoint(x:0, y: 30))
mdotteShapePath.addLine(to: CGPoint(x:UIScreen.main.bounds.size.width, y:30))
layer0.path = mdotteShapePath

//MARK: 实心矩形
let layer = CAShapeLayer()
layer.frame = CGRect(x:80, y:50, width:150, height:50)
layer.backgroundColor = UIColor.green.cgColor
view.layer.addSublayer(layer)

//MARK: 矩形框
let layer1 = CAShapeLayer()
layer1.fillColor = UIColor.clear.cgColor
layer1.strokeColor = UIColor.green.cgColor
view.layer.addSublayer(layer1)

let path1 = UIBezierPath(rect: CGRect(x:80, y:110, width:150, height:50))
layer1.path = path1.cgPath

//MARK: 圆角矩形
let path2 = UIBezierPath(roundedRect: CGRect(x:80, y:170, width:150, height:50), cornerRadius: 50)
let layer2 = CAShapeLayer()
layer2.path = path2.cgPath
layer2.fillColor = UIColor.clear.cgColor
layer2.strokeColor = UIColor.green.cgColor
view.layer.addSublayer(layer2)

//MARK: 圆形
let radius: CGFloat = 20
let startAngle: CGFloat = 0.0
let endAngle: CGFloat = CGFloat(M_PI * 2)
let path3 = UIBezierPath(arcCenter: view.center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
let layer3 = CAShapeLayer()
layer3.path = path3.cgPath
layer3.fillColor = UIColor.clear.cgColor
layer3.strokeColor = UIColor.green.cgColor
view.layer.addSublayer(layer3)

//MARK: 贝塞尔曲线
let startPoint = CGPoint(x:20, y:400)
let endPoint = CGPoint(x:320, y:400)
let controlPoint = CGPoint(x:170, y:300)
let controlPoint1 = CGPoint(x:120, y:300)
let controlPoint2 = CGPoint(x:220, y:500)

//曲线1
let path10 = UIBezierPath()
let layer10 = CAShapeLayer()
path10.move(to: startPoint)
path10.addQuadCurve(to: endPoint, controlPoint: controlPoint)
layer10.path = path10.cgPath
layer10.fillColor = UIColor.clear.cgColor
layer10.strokeColor = UIColor.black.cgColor
view.layer.addSublayer(layer10)

//曲线2
let path20 = UIBezierPath()
let layer20 = CAShapeLayer()
path20.move(to: startPoint)
path20.addCurve(to: endPoint, controlPoint1: controlPoint1, controlPoint2: controlPoint2)
layer20.path = path20.cgPath
layer20.fillColor = UIColor.clear.cgColor
layer20.strokeColor = UIColor.black.cgColor
view.layer.addSublayer(layer20)

//MARK: 动画
//动画1
let animation = CABasicAnimation(keyPath: "strokeEnd")
animation.fromValue = 0
animation.toValue = 1
animation.duration = 2
layer10.add(animation, forKey: "")

//动画2
layer20.strokeStart = 0
layer20.strokeEnd = 1
let animation21 = CABasicAnimation(keyPath: "strokeStart")
//起始位置中间 结束为止左端
animation21.fromValue = 0.5
animation21.toValue = 0
animation21.duration = 2
let animation22 = CABasicAnimation(keyPath: "strokeEnd")
//起始位置中间 结束为止右端
animation22.fromValue = 0.5
animation22.toValue = 1
animation22.duration = 2
layer20.add(animation21, forKey: "")
layer20.add(animation22, forKey: "")

//动画3
let animation23 = CABasicAnimation(keyPath: "lineWidth")
animation23.fromValue = 1
animation23.toValue = 10
animation23.duration = 5
layer1.add(animation23, forKey: "")
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: