How To Enlarge UIImageView When Tapped

Question

I'm very new to programming, so I'm having some issues trying to do this. I have an app that displays an image in a UIImageView, and I would like for the image to enlarge when the user taps on it. I figured that the easiest way to do this would be to hide a translucent button over the UIImageView, and fire off an action when the user taps it. That is about as far as I can get, I have no idea what my action method should look like. This is what I have so far:

- (IBAction)enlargeImage1:(id)sender {
    CGRect myImageRect = CGRectMake(0.0f, 0.0f, self.view.frame.size.width, 80.0f); 
    UIImageView *myImage = [[UIImageView alloc] initWithFrame:myImageRect]; 
    [myImage setImage:[UIImage imageNamed:@"gradient-253x80.png"]]; 
    [self.view addSubview:myImage];

}

My UIImageView is named imageView, and I attached the above method to the UIButton that is over imageView. When I click on the image, it does not enlarge at all. Any help or advice is much appreciated, thank you!

Answer 1

There are two ways you could approach this. You could either have a transparent button as you see which responds to a tap and have the imageview underneath.

Another approach would be to simply do away with the UIImageView and simply have a UIButton. You can set the button type in your xib/storyboard to be a custom button. You can then set the button's image or background image in the interface builder. All you need then is to connect your button to an action.

Your action could be something like follows in your header file:

- (IBAction)buttonTapped:(id)sender;

In your implementation you simply need to change the frame of the UIImageView or the UIButton depending on your approach.

- (IBAction)buttonTapped:(id)sender {
    UIButton *button = (UIButton *)sender;
    [button setFrame:CGRectMake(0, 0, 100, 100)];
    // or [yourImageViewName setFrame:CGRectMake(0, 0, 100, 100)];
}

You will need to adjust the values in CGRectMake to fit to your needs. The first two arguments are the x and y coordinates of where the button/image appears in its parent view. The second two arguments are the width and height of the button/image.

Hope that helps.

* EDIT Have you connected the UIImageView to an outlet in your header file?

in your method instead of creating another image, you should simply change the size of your existing one. You can do this as follows:

[self.imageView setFrame:CGRectMake(0, 0, self.view.frame.size.width, 80)];