StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POAnimating Frame with CoreAnimation
text
Body
copied!<p>I'm trying to animate position of some subviews in a scrollview. I want to create a specific effect as they slide in. I was just using implicit animation by changing the frame on UIView but when they slide in it looks too robotic. So I was hoping to create a bounce effect where they slide in, go a bit to far, and then go back to their intended position, pretty much to how a scrollview looks when it reaches an end, just sort of the opposite.</p> <p>Anyways, I can't get it to animate changing the frame's origin. I'm not sure what I'm missing, because if I switch out what is being animated (make the first //* to /*) it works just fine changing the opacity.</p> <pre><code>- (void)slideInStories; { float scrollViewContentWidth = 0; for (StoryViewController *storyController in storyControllers) { NSMutableArray *animationPoints = [NSMutableArray array]; CGRect viewFrame = storyController.view.frame; //* CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"frame"]; [animationPoints addObject:[NSValue valueWithCGRect:viewFrame]]; viewFrame.origin.x = scrollViewContentWidth - 10; [animationPoints addObject:[NSValue valueWithCGRect:viewFrame]]; viewFrame.origin.x = scrollViewContentWidth; [animationPoints addObject:[NSValue valueWithCGRect:viewFrame]]; /*/ CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"]; [animationPoints addObject:[NSNumber numberWithFloat:0.75]]; [animationPoints addObject:[NSNumber numberWithFloat:0.0]]; [animationPoints addObject:[NSNumber numberWithFloat:0.75]]; //*/ [animation setValues:animationPoints]; [animation setDuration:4.0]; viewFrame.origin.x = scrollViewContentWidth; scrollViewContentWidth += viewFrame.size.width; [storyController.view.layer setFrame:viewFrame]; [storyController.view.layer setOpacity:1.0]; [storyController.view.layer addAnimation:animation forKey:nil]; } [scrollView setContentSize:CGSizeMake(scrollViewContentWidth, 187.0f)]; } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload