2016-04-18 11 views
1

Ich möchte eine Animation erstellen, wo ein Objekt seine Position entlang einer path animiert. Das Problem, das ich habe, macht diese path dynamisch, was bedeutet, dass es auf allen Bildschirmgrößen funktioniert.Dynamic UIBezierPath für Animationen

Das Raumschiff in der Grafik oben folgt zunächst einem "U" -Form path.

Ich benutze dieses "U" -Form path und es funktioniert, hier ist der Code:

func animateAlongPath() { 
    // Create and add image to view 
    let myImage = UIImage(named: "myImage")! 
    let myImageView = UIImageView(image: myImage) 

    myImageView.frame = CGRect(x: 100, y: 100, width: myImage.size.width, height: myImage.size.height) 
    holderView.addSubview(myImageView) 

    // Create "U" shape path for animation (path code created in PaintCode) 
    let path = UIBezierPath() 
    path.moveToPoint(CGPointMake(59.5, 81.5)) 
    path.addCurveToPoint(CGPointMake(66.5, 91.5), controlPoint1: CGPointMake(63.64, 84.13), controlPoint2: CGPointMake(62.62, 85.9)) 
    path.addCurveToPoint(CGPointMake(81.5, 110.5), controlPoint1: CGPointMake(72.31, 99.88), controlPoint2: CGPointMake(75.91, 103.08)) 
    path.addCurveToPoint(CGPointMake(109.5, 142.5), controlPoint1: CGPointMake(88.44, 119.71), controlPoint2: CGPointMake(102.39, 135.23)) 
    path.addCurveToPoint(CGPointMake(145.5, 156.5), controlPoint1: CGPointMake(122.47, 155.76), controlPoint2: CGPointMake(129.15, 157.54)) 
    path.addCurveToPoint(CGPointMake(237.5, 81.5), controlPoint1: CGPointMake(185.04, 153.99), controlPoint2: CGPointMake(237.5, 81.5)) 

    let pathAnimation = CAKeyframeAnimation(keyPath: "position") 
    pathAnimation.path = path.CGPath // Use "U" shape path for animation 
    pathAnimation.calculationMode = kCAAnimationPaced 
    pathAnimation.timingFunctions = [CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut)] 
    pathAnimation.duration = 1 
    pathAnimation.removedOnCompletion = false 
    pathAnimation.fillMode = kCAFillModeForwards 

    myImageView.layer.addAnimation(pathAnimation, forKey: nil) 
    myImageView.layer.position = path.currentPoint 
} 

Das Problem ist, dass die UIBezierPath nicht dynamisch ist. Es funktioniert gut auf dem iPhone 6-Gerät Bildschirmgröße, aber funktioniert nicht gut auf anderen Geräten Größe, da es statisch ist. Ich habe versucht, mit PaintCode dynamische Pfade mit Variablen zu erstellen, aber es kann einfach nicht funktionieren.

Irgendwelche Ideen?

+0

konnte man nicht eine Skala auf Ihrem Weg anwenden verwandeln? – nielsbot

+0

@nielsbot Danke für Ihre Antwort! Ich bin mir nicht sicher, wie ich das machen würde. Können Sie ein Beispiel geben? – JEL

Antwort

0

PaintCode kann Code für resizable UIBezierPaths mit Frames generieren.

gebe Bezier innerhalb eines Rahmen Objekt und dann gewünschte automatischen Größenfedern eingestellt (alle flexibel). Der resultierende Code wird mit CGRect/NSRect parametrisiert und verwendet relative Koeffizienten zur Berechnung von Bezierpunkten.

Es gibt auch ein Video-Tutorial about Dynamic Shapes, wenn Sie mehr in die Tiefe gehen wollen.

PaintCode Bezier in Frame