Search code examples
iphoneiosipadios7

animation similar to opening app in ios7


I want to create an animation similar to app opens in iPhone in iOS7. In this animation it just shows that app is opening from which point and closing at same point.

Can anyone please help me?


Solution

  • @property (weak, nonatomic) IBOutlet UIImageView *bg;
    @property (weak, nonatomic) IBOutlet UIImageView *cal;
    …
    
    bool nowZoomed = NO;
    CGRect iconPosition = {16,113,60,60}; // customize icon position
    
    - (CGRect)zoomedRect // just a helper function, to get the new background screen size
    {
        float screenWidth = UIScreen.mainScreen.bounds.size.width;
        float screenHeight = UIScreen.mainScreen.bounds.size.height;
    
        float size = screenWidth / iconPosition.size.width;
        float x = screenWidth/2 - (CGRectGetMidX(iconPosition) * size);
        float y = screenHeight/2 - (CGRectGetMidY(iconPosition) * size);
    
        return CGRectMake(x, y, screenWidth * size, screenHeight * size);
    }
    
    - (IBAction)test
    {
        float animationDuration = 0.3f; //default
        if (nowZoomed) // zoom OUT
        {
            [UIView animateWithDuration:animationDuration animations:^{ // animate to original frame
                _cal.frame = iconPosition;
                _bg.frame = UIScreen.mainScreen.bounds;
            } completion:^(BOOL finished) {
                [UIView animateWithDuration:animationDuration/2.0f animations:^{ // then fade out
                    _cal.alpha = 0.0f;
                } completion:^(BOOL finished) {
                    _cal.hidden = YES;
                }];
            }];
        }
        else // zoom IN
        {
            _cal.alpha = 0.0f;
            _cal.hidden = NO;
            [UIView animateWithDuration:animationDuration/2.0f animations:^{ // fade in faster
                _cal.alpha = 1.0f;
            }];
            [UIView animateWithDuration:animationDuration animations:^{ // while expanding view
                _cal.frame = UIScreen.mainScreen.bounds;
                _bg.frame = [self zoomedRect];
            }];
        }
        nowZoomed = !nowZoomed;
    }
    

    you can test it, by creating a sample project like this:

    • make two screenshots from simulator like I did (homescreen and calendar view) or grab these two: homescreen / calendar
    • add 2 image views and 1 button into storyboard
    • make the background image view as big as the whole screen
    • and the other image view with this dimensions: {16,113,60,60}
    • create an IBOutlet for both (the very first two lines of code)
    • set the button action target to -(void)test

    storyboard animation the storyboard picture (left) and animation transition (right)