Animated Splash Screen in iPhone

Question

I need to implement animated splash screen to the iPhone application. I have seen skype application where same thing is already implemented.

Can anyone has idea how can i implement same thing in my applicatio

Answer 1

Take a UIView & an Imageview into it. Give all your images to ImageView to animate.

-(void)viewDidLoad
{
 NSArray *arrImage=[NSArray arrayWithObjects:
                             [UIImage imageNamed:@"1.png"],
                             [UIImage imageNamed:@"2.png"],
                             [UIImage imageNamed:@"3.png"],
                             nil];

    imgVw.backgroundColor=[UIColor purpleColor];
    imgVw.animationImages=arrImage;
    imgVw.animationDuration=2.5;
    imgVw.animationRepeatCount=1;
    [imgVw startAnimating]; 

    [NSTimer scheduledTimerWithTimeInterval:4.0 target:self selector:@selector(animateNext) userInfo:nil repeats:NO];

}

This will show up you application icon.

After that you will show the controls those would be hidden by default and animate them from bottom to up.

-(void)animateNext
{
    lbl.hidden = NO;
    btn.hidden = NO;
    txt1.hidden = NO;
    txt2.hidden = NO;

    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:1.9];
    lbl.frame=CGRectMake(lbl.frame.origin.x,lbl.frame.origin.y - 150,lbl.frame.size.width,lbl.frame.size.height);
    imgVw.frame = CGRectMake(imgVw.frame.origin.x, imgVw.frame.origin.y - 150, imgVw.frame.size.width, imgVw.frame.size.height);
    txt1.frame = CGRectMake(txt1.frame.origin.x, txt1.frame.origin.y - 150, txt1.frame.size.width, txt1.frame.size.height);
    txt2.frame = CGRectMake(txt2.frame.origin.x, txt2.frame.origin.y - 150, txt2.frame.size.width, txt2.frame.size.height);
    btn.frame = CGRectMake(btn.frame.origin.x, btn.frame.origin.y - 150, btn.frame.size.width, btn.frame.size.height);
    [UIView commitAnimations];    


}

Hope this help...

Answer 2

yes simple in AppDelegate class first defile imageview like bellow..

@interface AppDelegate : UIResponder 
{
    UIImageView *splashView;
}

and in .m file...

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease];
    if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone) 
    {
        splashView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 320, 480)];
        splashView.image = [UIImage imageNamed:@"Default"];
        [self.window addSubview:splashView];

        [self performSelector:@selector(loadViewIphone) withObject:nil afterDelay:2.0];
    } 
    [self.window makeKeyAndVisible];
    return YES;
}

-(void)loadViewIphone 
{
    [splashView removeFromSuperview];
    self.window.rootViewController = self.tabBarController;
    [self.window makeKeyAndVisible];
    CATransition *animation = [CATransition animation];
    [animation setDelegate:self];   
    [animation setType:kCATransitionFade];
    [animation setDuration:0.5];
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:
                                  kCAMediaTimingFunctionEaseInEaseOut]];
    [[self.window layer] addAnimation:animation forKey:@"transitionViewAnimation"];
}

i hope this help you..

:)

Answer 3

We can show a .gif image in webView and it looks perfect!

Take a new UIViewController class named SplashView with XIB and then add an UIWebView with (320.0, 480.0) frame, hidden statusbar also.

In SplashView.h

#import <UIKit/UIKit.h>
@interface SplashView : UIViewController
@property(nonatomic, retain)IBOutlet UIWebView *webView;
@end

In SplashView.m

- (void)viewDidLoad
{
   [super viewDidLoad];
   NSString *imagePath = [[NSBundle mainBundle] pathForResource: @"animated" ofType: @"gif"];
   NSData *data = [NSData dataWithContentsOfFile:imagePath];
   [self.webView setUserInteractionEnabled:NO];
   [self.webView loadData:data MIMEType:@"image/gif" textEncodingName:nil baseURL:nil];
}

This is about SplashView class. Now come to your appdelegate's class.

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.
    self.viewController = [[ViewController alloc] initWithNibName:@"ViewController" bundle:nil];

    [[UIApplication sharedApplication] setStatusBarHidden:YES];
     splashView = [[SplashView alloc]initWithNibName:@"SplashView" bundle:nil];
    [self.window addSubview:splashView.view];

    [self performSelector:@selector(changeView) withObject:nil afterDelay:3.0];

    [self.window makeKeyAndVisible];
    return YES;
}

-(void)changeView
{
    [[UIApplication sharedApplication] setStatusBarHidden:NO];
    [splashView.view removeFromSuperview];
    [self.window setRootViewController:self.viewController];
}

Answer 4

you need to start your app with a viewcontroller,with an uiimageview in it..Create a series of .png images to be subjected to the UIImageView check how to animate array of images in uiimageview. Further to dismiss it once animation over you would need to implement a protocol that will inform your starting first viewcontroller of your app to dismiss the animation

Answer 5

- (void) welcomeScreen
{

 //Welcome Screen
 UIImageView* welcome = [[[UIImageView alloc] initWithFrame:CGRectMake(0,0,320,480)]autorelease];
 welcome.image = [UIImage imageNamed:@"img.png"];
 [window addSubview:welcome];
 [window bringSubviewToFront:welcome];

 //Animation Effects (zoom and fade)
 [UIView beginAnimations:nil context:nil];
 [UIView setAnimationDuration:2.0];
 [UIView setAnimationTransition:UIViewAnimationTransitionNone forView:window cache:YES];
 [UIView setAnimationDelegate:welcome];
 [UIView setAnimationDidStopSelector:@selector(removeFromSuperview)];

//set transparency to 0.0
 welcome.alpha = 0.0;

//zoom effect
 welcome.frame = CGRectMake(-60, -60, 440, 600);

 [UIView commitAnimations];


}

Answer 6

Try this

Appdelegate.h

   @interface AppDelegate : UIResponder <UIApplicationDelegate> 
    {
        UIImageView *splashView;
    }

@property (strong, nonatomic) UIWindow *window;

@property (strong, nonatomic) ViewController *viewController;

- (void)startupAnimationDone:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context;

AppDelegate.m

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.
    self.viewController = [[ViewController alloc] initWithNibName:@"ViewController" bundle:nil];
    self.window.rootViewController = self.viewController;
    [self.window makeKeyAndVisible];

// Make this interesting.
    splashView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0, 320, 480)];
    splashView.image = [UIImage imageNamed:@"Default.png"];
    [self.window addSubview:splashView];
    [self.window bringSubviewToFront:splashView];
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:2.0];
    [UIView setAnimationTransition:UIViewAnimationTransitionNone forView:self.window cache:YES];
    [UIView setAnimationDelegate:self]; 
    [UIView setAnimationDidStopSelector:@selector(startupAnimationDone:finished:context:)];
    splashView.alpha = 0.0;
    splashView.frame = CGRectMake(-60, -85, 440, 635);
    [UIView commitAnimations];

    return YES;
}

- (void)startupAnimationDone:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {
    [splashView removeFromSuperview];
}

Answer 7

You can use sequence of images, here is code :

for(NSInteger i=1;i<=totalImages;i++){
        NSString *strImage = [NSString stringWithFormat:@"Activity_%d",i];
        UIImage *image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:strImage ofType:@"png"]];
        [imageArray addObject:image];
    }
    splashImageView.animationImages = imageArray;
    splashImageView.animationDuration = 0.8;

and just call startAnimation and endAnimation method of UIImageView.

OR

Its very simple...I had used it in to begin my app with splashView.Hope it vil help you.... In AppDelegate.m:

application didFinishLaunchingWithOptions:

UIImage* image=[UIImage imageNamed:@"splash.jpg"];
splashView=[[UIImageView alloc]initWithImage:image];
[window addSubview:splashView];
[window bringSubviewToFront:splashView];
[self performSelector:@selector(removeSplash) withObject:self afterDelay:2];
[window makeKeyAndVisible];

To remove splashView:

-(void)removeSplash{

    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:window cache:YES];
    [UIView setAnimationDuration:0.75];
    [UIView setAnimationDelegate:self];
    [splashView removeFromSuperview];
    [UIView commitAnimations];
    [window addSubview:viewController.view];
}