iPhone/iPad: animated splash screen?

Question

I want to create an animated logo that serves as the splash screen for my iphone/ipad app.

I'm thinking of showing the default.png, which then transitions to an .mp4 (where the first frame of the .mp4 matches the default.png), plays a 3 second movie, fades out, and loads my application.

Does anyone have any experience with this? And is my idea (using .mp4) the best way to achieve this? Also, is Apple "cool" with this?

Thanks in advance.

I would suggest rethinking this plan, because a 3 second animated logo (on top of the wait there already is on the static splash screen) would probably cause half the people to quit your app before it's even done loading. — jhocking
I do a 2-3 second pause anyhow (and have successfully done so in multiple apps), so instead of a static screen I would assume the user would prefer an aesthetic animation. — Shai UI
Many apps use similar animations/movies. I think you're fine. — kball

kball kball · Accepted Answer · 2011-05-29T19:33:50

Yes you can absolutely do this and yes Apple is cool with it.

You could use MPMoviePlayerController, place it under a UIImageView with the launch image and when the movie is loaded and ready to go remove the UIImageView and play the movie.

But given the sometimes finicky nature of MPMoviePlayerController you need to time things carefully. Here's a snippet you can use as a starting point:

-(void)setupMovie {
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(movieComplete:)
                                                 name:MPMoviePlayerPlaybackDidFinishNotification object:self.playerView];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(playMovie:)
                                                 name:MPMoviePlayerLoadStateDidChangeNotification object:self.playerView];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(showMovie:)
                                                 name:MPMoviePlayerPlaybackStateDidChangeNotification object:self.playerView];

    [self.playerView setContentURL:[[NSBundle mainBundle] URLForResource:@"movie" withExtension:@"mov"]];
    [self.playerView prepareToPlay];
}


-(void)playMovie:(NSNotification *)notification {
    if (self.playerView.loadState == MPMovieLoadStatePlayable | MPMovieLoadStatePlaythroughOK) {
        [[NSNotificationCenter defaultCenter] removeObserver:self name:MPMoviePlayerLoadStateDidChangeNotification object:notification.object];
        [self.playerView play];     
    }
}

-(void)showMovie:(NSNotification *)notification {
    if (self.playerView.playbackState == 1) {
        [[NSNotificationCenter defaultCenter] removeObserver:self name:MPMoviePlayerPlaybackStateDidChangeNotification object:notification.object];
        // should update this to new UIView anim methods
        [UIView beginAnimations:nil context:nil];
        [UIView setAnimationDuration:.2];
        self.splashScreen.alpha = 0;
        [UIView commitAnimations];      
    }
}

iPhone/iPad: animated splash screen?

3 Answers