2

NO UIVIEW ANIMATIONS, I'M LEARNING CORE ANIMATION

When I run this code, the top image is not on the screen. Then 4 seconds later, it reappears and does as expected. Not sure why. What I want is for the top image to be on the screen when the app launches, and then 4 seconds later for the top image to move up and out of the screen.

 @IBOutlet var top: UIImageView! override func viewDidAppear(animated: Bool) { super.viewDidAppear(animated) let openTop = CABasicAnimation(keyPath: "position.y") openTop.fromValue = self.top.frame.origin.y openTop.toValue = -self.view.bounds.size.height openTop.duration = 1.0 openTop.beginTime = CACurrentMediaTime() + 4 self.top.layer.addAnimation(openTop, forKey: nil) self.top.layer.position.y = -self.view.bounds.size.height } 

Any thoughts?

2 Answers 2

0

Here's what I came up with:

let l = top.layer! let startingPosition = l.position l.position = CGPointMake( CGRectGetMidX( self.view.bounds ), -l.frame.height * 0.5 ) l.addAnimation({ let anim = CABasicAnimation( keyPath: "position" ) anim.fromValue = NSValue( CGPoint:startingPosition ) anim.beginTime = CACurrentMediaTime() + 4.0 anim.fillMode = kCAFillModeBoth return anim }(), forKey: nil) 
Sign up to request clarification or add additional context in comments.

2 Comments

I accepted this answer because its the simplest here. Can you explain why you have to move the layers position first with l.position = CGPointMake( CGRectGetMidX( self.view.bounds ), -l.frame.height * 0.5 )? The way I was doing it was calling soothing similar to this after I added the animation but you did it before adding the animation. Why is this the way to do it?
It think it's less code that way. You also don't have to worry about removing the animation later.
0

so you want the image to be on-screen at the start, and then 4 seconds later to fly off the top? You can do this by grouping animations together

override func viewDidAppear(animated: Bool) { super.viewDidAppear(animated) // keep a track of where we want it to be let y = self.top.layer.position.y // move it out of the way - this where it will end up after the animation self.top.layer.position.y = -self.view.bounds.size.height // do nothing, other than display the image for 4 seconds let doNothing = CABasicAnimation(keyPath: "position.y") doNothing.fromValue = y doNothing.toValue = y doNothing.duration = 4.0 // zip it away let openTop = CABasicAnimation(keyPath: "position.y") openTop.fromValue = y openTop.toValue = -self.view.bounds.size.height openTop.duration = 1.0 openTop.beginTime = doNothing.beginTime + doNothing.duration // create the group let group = CAAnimationGroup() group.duration = 5.01 group.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut) group.removedOnCompletion = false group.fillMode = kCAFillModeForwards group.animations = [doNothing, openTop] self.top.layer.addAnimation(group, forKey: nil) } 

10 Comments

If I do that, the animation works, but when the animation ends, the image goes back to where it started. The image just appears back at where it started. Any other suggestions?
good point - you could use a group of animations (just two in this case) Start with top off-screen, bring it on-screen VERY fast, so it doesn't look like an animation, and the slowly remove it. Here's a description of grouping animations stackoverflow.com/questions/11737658/… and I will update the answer to show what I mean
Ok thanks looking forward to your updated answer --- I'm still very new to core animation so hard for me to implement groups on my own
You can simply position your image off the top of the screen, then add an animation that moves it from on screen to off
I have simplified the answer above, based on @nielsbot's comment
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.