Kukula Mula
Kukula Mula

Reputation: 1869

Creating a flying animation

I'd like to have a kind of "Fly In" PowerPoint like animation done in Xcode.

The view will fly-in from a given direction (up,down, left, right) stop at the center of the screen for a given amount of time and then continue flying in the same direction until it goes out of screen

I've tried playing with the different animation options, but all act like:

UIViewAnimationOptionTransitionNone

So I'm doing something wrong?

UIViewAnimationOptions animationOption[] = {
UIViewAnimationOptionTransitionNone,
UIViewAnimationOptionTransitionFlipFromLeft,
UIViewAnimationOptionTransitionFlipFromRight,
UIViewAnimationOptionTransitionCurlUp,
UIViewAnimationOptionTransitionCurlDown,
UIViewAnimationOptionTransitionCrossDissolve,
UIViewAnimationOptionTransitionFlipFromTop,
UIViewAnimationOptionTransitionFlipFromBottom
};

self.frame = p_newFrame;
int idx = arc4random() % 8;
[UIView animateWithDuration:p_duration delay:0.8 options:animationOption[idx] animations:^{
      self.alpha = 1.0;
} completion:^(BOOL finished) {
}];

Can anyone help with code example?

Upvotes: 1

Views: 1360

Answers (1)

Rob
Rob

Reputation: 437422

Lots of ways to accomplish this, but one easy technique is to add a subview, setting the initial frame such that it's initially off-screen. Then, animate the changing of the frame so it's within the visible screen. Then, in the completion block, have another animation (this one with a delay) to animate it flying off the other direction. E.g.

CGRect frameVisible = self.view.bounds;                                // Or use `CGRectMake` to specify something smaller than the whole screen
CGRect frameRight = frameVisible;
frameRight.origin.x += self.view.frame.size.width;
CGRect frameLeft = frameVisible;
frameLeft.origin.x -= self.view.frame.size.width;

UIView *subview = [[UIView alloc] initWithFrame:frameRight];           // add if off screen to right

// just doing this so I can see it; you'd presumably add all sorts of subviews
// (labels, images, whatever)

subview.backgroundColor = [UIColor lightGrayColor];                    // I'm just going to make it gray, so I can see it

[self.view addSubview:subview];

[UIView animateWithDuration:0.5 delay:0.0 options:0 animations:^{
    subview.frame = frameVisible;                                      // animate it on screen
} completion:^(BOOL finished) {
    [UIView animateWithDuration:0.5 delay:3.0 options:0 animations:^{  // wait 3 sec, then ...
        subview.frame = frameLeft;                                     // ... animate it off screen to left
    } completion:^(BOOL finished) {
        [subview removeFromSuperview];                                 // when all done, remove it from screen
    }];
}];

Just adjust the various CGRect values you'll use for the frame property to control where it starts, where it stops on screen, and where it flies off to.

Upvotes: 3

Related Questions