动画贝塞尔直线

时间:2015-08-28 04:41:42

标签: ios animation line uibezierpath

我想要如跷跷板那样为bezier直线设置动画。有人可以建议吗。动画的参考链接应如何显示(https://www.youtube.com/watch?v=bjCx128BZK8)。

1 个答案:

答案 0 :(得分:2)

您不能说出如何呈现此UIBezierPath,但如果您将其添加为CAShapeLayer,则只需应用CAKeyframeAnimation即可:

// create simple path

let path = UIBezierPath()
path.moveToPoint(CGPoint(x: 50, y: view.bounds.size.height / 2))
path.addLineToPoint(CGPoint(x: view.bounds.size.width - 50, y: view.bounds.size.height / 2))

// create `CAShapeLayer` from that path

let layer = CAShapeLayer()
layer.path = path.CGPath
layer.lineWidth = 10
layer.strokeColor = UIColor.blueColor().CGColor
layer.fillColor = UIColor.clearColor().CGColor

view.layer.addSublayer(layer)

// animate it

let animation = CAKeyframeAnimation(keyPath: "transform")
var values = [NSValue]()
for var x: CGFloat = 0.0; x < CGFloat(M_PI * 4); x += CGFloat(M_PI * 4 / 100.0) {
    var transform = CATransform3DMakeTranslation(view.frame.size.width/2, view.frame.size.height/2, 0.0)
    transform = CATransform3DRotate(transform, sin(x) / 3.0, 0.0, 0.0, 1.0)
    transform = CATransform3DTranslate(transform, -view.frame.size.width/2, -view.frame.size.height/2, 0.0)

    values.append(NSValue(CATransform3D: transform))
}
animation.duration = 2
animation.values = values

layer.addAnimation(animation, forKey: "transform")

产量:

enter image description here

或者您可以将CAShapeLayer添加到视图中,然后使用基于块的UIView动画来旋转视图。基本想法是一样的。

如果您想做更复杂的事情,可以使用CADisplayLink,更新path CAShapeLayer(如here所述)或更新所用属性通过UIView子类,然后调用setNeedsDisplay