CAShapeLayer Pfadfrühlingsanimation nicht "überschießend"

Question

Ich experimentiere mit dem Animieren von CAShapeLayer Wegen mit CASpringAnimation. Das erwartete Ergebnis ist ein "Morphing" zwischen Formen, die "federnd" wirken.

Ich habe ein grundlegendes Codebeispiel zwischen einem Kreis und einem quadratischen Pfad wie unten, jedoch ist das Endergebnis eine Federanimation, die nicht über den endgültigen, größeren quadratischen Pfad "hinausschießt", was das erwartete Verhalten ist.

Mein Code ist:

let springAnimation = CASpringAnimation(keyPath: "path") 
springAnimation.damping = 1 
springAnimation.duration = springAnimation.settlingDuration 
springAnimation.fromValue = standardCirclePath().cgPath 
springAnimation.toValue = standardSquarePath().cgPath 

circleLayer.add(springAnimation, forKey: nil) // Where circleLayer (red background) is a sublayer of a basic UIView in the frame (blue background) 

ich meine Wege from this answer bekam.

Gibt es einen Weg mit CASspringAnimation, um dies für eine CAShapeLayer Pfadtransformation zu erreichen? Welche Alternativen gibt es sonst?

Answer 1

Hallo, ich habe auf Ihre Frage gearbeitet, und dies ist meine Ergebnisse, werden die Störungen auf der gif, weil mein gif-Wandler sehr schlecht Konverter ist

Dies ist der Code

class ViewController: UIViewController { 

    @IBOutlet weak var animatableVIew: UIView! 
    var isBall = false 
    override func viewDidLoad() { 
     super.viewDidLoad() 
     // Do any additional setup after loading the view, typically from a nib. 
    } 
    @IBAction func startAnimation(sender: AnyObject) { 

     isBall = !isBall 

     let springAnimation = CASpringAnimation(keyPath: "cornerRadius") 
     let halfWidth = animatableVIew.frame.width/2 
     let cornerRadius: CGFloat = isBall ? halfWidth : 0 
     springAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn) 
     springAnimation.fromValue = isBall ? 0 : halfWidth ; 
     springAnimation.toValue = cornerRadius; 
     springAnimation.damping = 7 
     springAnimation.duration = springAnimation.settlingDuration 
     animatableVIew.layer.cornerRadius = cornerRadius 

     let springAnimation2 = CAKeyframeAnimation(keyPath: "transform.scale") 
     springAnimation2.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear) 
     springAnimation2.values = [1,0.9,1.4,0.8,1] 
     springAnimation2.keyTimes = [ 0, (1/6.0), (3/6.0), (5/6.0), 1 ]; 
     springAnimation2.duration = springAnimation.settlingDuration * 0.5 

     let groupSpringAnimation = CAAnimationGroup() 
     groupSpringAnimation.animations = [springAnimation,springAnimation2] 
     groupSpringAnimation.duration = springAnimation.settlingDuration 
     groupSpringAnimation.beginTime = 0; 
     animatableVIew.layer.addAnimation(groupSpringAnimation, forKey: "group") 

    } 

    override func didReceiveMemoryWarning() { 
     super.didReceiveMemoryWarning() 
     // Dispose of any resources that can be recreated. 
    } 


} 

Ich hoffe, das hilft dir