CODEWITHSUNDEEP
iosuikitsplash-screen
Mazyod
Mazyod

Reputation: 22559

iOS: Animate splash screen out on top of status bar

OK, I get the concept of adding a UIImageView as soon as the app launches, and animating it out to fake the splash animation. However, the status bar interferes.

I need a UIImageView on top of everything, including the status bar, and while it fades away, the app is shown with the status bar. Hence, settings the Status bar initially hidden, then animating it in is not a viable option.

Upvotes: 0

Views: 770

Answers (2)

Léo Natan
Léo Natan

Reputation: 57050

What you require is a second UIWindow with a windowLevel of UIWindowLevelStatusBar or higher. You would create two UIWindow objects in your application delegate, one with your regular view hierarchy, the other with the image, and animate the second to fade out (or however else you need to animate). Both windows should be visible, with the splash window being on top.

This approach is complicated, as you might have problems with rotation, depending on your regular view hierarchy. We've done this in our software, and it works well.

EDIT:

Adapted Solution (window approach, very simple):

UIImageView* splashView = [[UIImageView alloc] initWithImage:[UIImage imageWithBaseName:@"Default"]];
[splashView sizeToFit];

UIViewController* tmpVC = [UIViewController new];
[tmpVC.view setFrame:splashView.bounds];
[tmpVC.view addSubview:splashView];

// just by instantiating a UIWindow, it is automatically added to the app.
UIWindow *keyWin = [UIApplication sharedApplication].keyWindow;
UIWindow *hudWindow = [[UIWindow alloc] initWithFrame:CGRectMake(0.0f, -20.0f, keyWin.frame.size.width, keyWin.frame.size.height)];

[hudWindow setBackgroundColor:[UIColor clearColor]];
[hudWindow setRootViewController:tmpVC];
[hudWindow setAlpha: 1.0];
[hudWindow setWindowLevel:UIWindowLevelStatusBar+1];
[hudWindow setHidden:NO];

_hudWin = hudWindow;

[UIView animateWithDuration:2.3f animations:^{
    [_hudWin setAlpha:0.f];
} completion:^(BOOL finished) {
    [_hudWin removeFromSuperview];
    _hudWin = nil;
}];

Finally, credit goes to this guy.

A more simple approach would be to launch your application with the status bar hidden, have the view you would like to animate on the top of the view hierarchy, and after the animation is finished, display the status bar using [[UIApplication sharedApplication] setStatusBarHidden:NO withAnimation:UIStatusBarAnimationSlide]

Upvotes: 2

bluefloyd8
bluefloyd8

Reputation: 2276

You can add a subview to the App's UIWindow. Set the Y coordinate of the UIImageView's frame to -20 pixels in order to handle the status bar.

Add the Default PNG image to your window and tag it:

static const NSInteger kCSSplashScreenTag = 420; // pick any number!
UIImageView *splashImageView;

// Careful, this wont work for iPad!
if ( [[UIScreen mainScreen] bounds].size.height > 480.0f ) // not best practice, but works for detecting iPhone5.
{
    splashImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Default-568h"]];
}
else
{
    splashImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Default"]];
}

splashImageView.frame = CGRectMake(0.0f, -20.0f, splashImageView.image.size.width, splashImageView.image.size.height);
splashImageView.tag = kCSSplashScreenTag;
[self.window addSubview:splashImageView];
[splashImageView release];

[self _fadeOutSplaceImageView];

Then fade it out

- (void)_fadeOutSplashImageView
{
    UIView *splashview = [self.window viewWithTag:kCSSplashScreenTag];
    if ( splashview != nil )
    {
        [UIView animateWithDuration:0.5
                              delay:0.0
                            options:0
                         animations:^{
                             splashview.alpha = 0.0f;
                         }
                         completion:^(BOOL finished) {
                             [splashview removeFromSuperview];
                         }];
    }
}

Upvotes: 0

Related Questions