UIView Animation for ImageView in ios

Question

i Have requirement were i have to animate image view from current position to full screen in grid view. i made images into Grid view.

- (void)viewDidLoad
{
    [super viewDidLoad];

    imagesArray = [[NSMutableArray alloc] init];        
    for (int i=1; i<11; i++) {

        [imagesArray addObject:[UIImage imageNamed:[NSString stringWithFormat:@"image%d.png", i]]];
        NSLog(@"imagesArray:%@", imagesArray);               
    }

    float horizontal = 20.0;
    float vertical = 20.0;

    for(int i=0; i<[imagesArray count]; i++)
    {
        if((i%3) == 0 && i!=0)
        {
            horizontal = 20.0;
            vertical = vertical + 220.00 + 20.0;
        }

        imagesView = [[UIImageView alloc] initWithFrame:CGRectMake(horizontal, vertical, 310.0, 220.00)];
        imagesView.userInteractionEnabled = YES;
        [imagesView setImage:[imagesArray objectAtIndex:i]];
        imagesView.tag = i;

        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTap:)];
        tap.numberOfTapsRequired = 1;
        tap.numberOfTouchesRequired = 1;

        [imagesView addGestureRecognizer:tap];

        [self.view addSubview:imagesView];
        horizontal = horizontal + 310.0 + 20.0;
      }

}

here i have created grid view with images, like i have 10 images. i made 3x3 grid view.

next i have add tap gesture to it and i am getting the image view position by calling with tag

-(void)handleTap:(UITapGestureRecognizer *)recognizer
{
        UIView *piece = recognizer.view;

        [UIView animateWithDuration:1.0 animations:^{
            piece.frame = CGRectMake(piece.frame.origin.x, piece.frame.origin.y, 1000, 700);

        } completion:^(BOOL finished) {

    }];

    } 

Can you say me how to make image view animate from current position to full screen by tapping on it.

Answer 1

Since you're adding the views to self.view of your view controller, you can assume that self.view is occupying the entire screen of the device. Therefore, you can animate to its bounds:

[UIView animateWithDuration:1.0 animations:^{
    piece.frame = self.view.bounds;
} completion:nil];

Note that if piece must have a parent view that spans across the entire screen so that your inner view won't be clipped during animation.

Answer 2

This code will help u to add the animation effect like zoom your imageview that your are expecting. You need to customize once the animation is over show the full screen image view.

-(void)addZoomAnimationToZoomViewController:(UIImageView *)zoomView
{
    CABasicAnimation *zoomAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    [zoomAnimation setDuration:0.8];
    [zoomAnimation setRepeatCount:1];
    [zoomAnimation setFromValue: [NSNumber numberWithFloat:0.1]];
    [zoomAnimation setToValue: [NSNumber numberWithFloat:5.0] ];
    [zoomAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
    [[zoomView layer] addAnimation:zoomAnimation forKey:@"zoom"];
}