自动开始一个strokeEnd动画

我有一个绘制一个圆的动画。我结合3个不同的圆形动画来创建一个程式化的图形/饼图。自动开始一个strokeEnd动画

它们在按钮的@IBAction中动画完美。但是如何在Storyboard/ViewController打开/导航到时自动启动动画？

动画代码如下：

//NF Colour 
    let colorNF = UIColor(red: 28/255, green: 117/255, blue: 189/255, alpha: 1) 

    // Create Holding Rectangle and Start and End Angles 
    let ovalStartAngleNF = CGFloat(-90.01 * .pi/180) 
    let ovalEndAngleNF = CGFloat(10.0 * .pi/180) 
    let ovalRectNF = CGRect(origin: CGPoint(x: 122.5,y: 83.5), size: CGSize(width: 100, height: 100)) 

    // Create Bezier Path 
    let ovalPathNF = UIBezierPath() 

    // Apply Attributes to Bezier Path 
    ovalPathNF.addArc(withCenter: CGPoint(x: ovalRectNF.midX, y: ovalRectNF.midY), 
         radius: ovalRectNF.width/2, 
         startAngle: ovalStartAngleNF, 
         endAngle: ovalEndAngleNF, clockwise: true) 

    // Styling of the Curve 
    let progressLineNF = CAShapeLayer() 
    progressLineNF.path = ovalPathNF.cgPath 
    progressLineNF.strokeColor = colorNF.cgColor 
    progressLineNF.fillColor = UIColor.clear.cgColor 
    progressLineNF.lineWidth = 20.0 
    progressLineNF.lineCap = kCALineCapRound 

    // Add Curve to Viewport 
    self.view.layer.addSublayer(progressLineNF) 

    // Animated the 'Stroke End' from 0 to 1 over 3 Seconds 
    let animateStrokeEndNF = CABasicAnimation(keyPath: "strokeEnd") 
    animateStrokeEndNF.duration = 3.0 
    animateStrokeEndNF.fromValue = 0.0 
    animateStrokeEndNF.toValue = 1.0 

    // Add the Animation to the Progress Line 
    progressLineNF.add(animateStrokeEndNF, forKey: "animate stroke end animation")

来源

2017-05-11 Ryan Elliott

将您的动画代码移动到您的'viewDidLoad'。 – Joe

@Joe我刚刚尝试过这样做，并且圈子立即被绘制出来，而不是从0到1的动画。任何其他想法？ –

尝试将动画持续时间更改为更高值> 3（animateStrokeEndNF.duration = 10.0）并尝试将代码移动到'viewDidAppear或viewWillAppear'以创建一些启动延迟？ – Joe

正如评论说乔。解决方案是将我的动画代码放入viewWillAppear中。

override func viewWillAppear(_ animated: Bool) { *ANIMATION CODE* }

来源

2017-05-11 13:32:04

自动开始一个strokeEnd动画

回答

相关问题