Show UIImageView on screen Tap

Question

I am trying to Display a an Image when the user Taps on the UIImageView . But before the user Taps the UIImageView the Image should not be shown, and after a few seconds the Image should disappear again. Does anyone know how to do this? I read through couple of Threads but they do not work with the latest Xcode as it appears. Thanks for your help and time.

Udate

Well, my code now looks like this:

    -(void)imageTapped:(UITapGestureRecognizer*)recognizer
    {
        recognizer.view.alpha=0.0;
        ((UIImageView*)recognizer.view).image = [UIImage imageNamed:@"twingo_main.png"];

        [UIView animateWithDuration:1.0 delay:2.0 options:0 animations:^{
            recognizer.view.alpha=1.0;
        } completion:^(BOOL finished) {
            recognizer.view.alpha=0.0;
            ((UIImageView*)recognizer.view).image = nil;
            recognizer.view.alpha=1.0;
        }];
    }

    - (void)viewDidLoad
    {

        UIImageView *hiddenImage = [[UIImageView alloc] initWithFrame:CGRectMake(0, 30, 20, 20)];
        hiddenImage.userInteractionEnabled=YES;
        [hiddenImage addGestureRecognizer:[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(imageTapped:)]];
        [self.view addSubview:hiddenImage];

Well, now my question is, how do I need to set up the UIImageView in the View Controller?

Answer 1

In your UIViewController 's viewDidLoad method:

    ...

UIImageView *hiddenImage = [[UIImageView alloc] initWithFrame:CGRectMake(0, 30, 20, 20)];
        hiddenImage.userInteractionEnabled=YES;
        [hiddenImage addGestureRecognizer:[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(imageTapped:)]];
        [self.view addSubview:hiddenImage];
    ...

UITapGestureRecognizer Handler:

-(void)imageTapped:(UITapGestureRecognizer*)recognizer
{
    recognizer.view.alpha=0.0;
    ((UIImageView*)recognizer.view).image = [UIImage imageNamed:@"imageName"];

    [UIView animateWithDuration:1.0 delay:2.0 options:0 animations:^{
        recognizer.view.alpha=1.0;
    } completion:^(BOOL finished) {
        recognizer.view.alpha=0.0;
        ((UIImageView*)recognizer.view).image = nil;
        recognizer.view.alpha=1.0;
    }];
}

Answer 2

Set the image in the UIImageView to nil initially. Add a tap gesture recognizer to the UIImageView that, when fired, sets the image and starts a timer. When the timer completes, set your image back to nil.

Answer 3

Here is an another way to handle above with NSTimer..

    -(void)imageTapped:(UITapGestureRecognizer*)recognizer
    {    

        CustomPopUpView *lCustomPopUpView = [[CustomPopUpView alloc]init];
        //Added your imageview to Custom UIView class
        [self.window addSubview:lCustomPopUpView];
        [self.window bringSubviewToFront:lCustomPopUpView];
        mPopupTimer = [NSTimer scheduledTimerWithTimeInterval:2 target:self  selector:@selector(closePopUp) userInfo:Nil repeats:FALSE]; 

     }
    - (void)closePopUp{             

        if (mPopupTimer != nil) {
            [mPopupTimer invalidate];
            mPopupTimer = nil;
        }
        for (UIView *lView  in self.window.subviews) {
            if ([lView isKindOfClass:[CustomPopUpView class]]) {
                [lView removeFromSuperview];
            }
        }
    } 

Answer 4

Its better to have view behind the UIImageView to handle the TapGesture . But here is the fix for you code:

Add this to viewDidLoad method to setup you image view to handle tap gesture

//By default the UserInteraction is disabled in UIImageView
       [self.testImageView setUserInteractionEnabled:YES];
        UITapGestureRecognizer *tapgesture=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(ShowImage:)];
        tapgesture.numberOfTapsRequired=1;
        tapgesture.numberOfTouchesRequired=1;

        [self.testImageView addGestureRecognizer:tapgesture];

here is the method handle the gesture event

-(void)ShowImage:(UIGestureRecognizer*)recognizer{

    recognizer.view.alpha=0.0;
    ((UIImageView*)recognizer.view).image = [UIImage imageNamed:@"clone.jpg"];

    [UIView animateWithDuration:1.0 delay:0 options:0 animations:^{
        recognizer.view.alpha=1.0;
    } completion:^(BOOL finished) {
        //[self performSelector:@selector(hideImage:) withObject:recognizer.view afterDelay:10];
        [UIView animateWithDuration:1.0 delay:3.0 options:0 animations:^{
            recognizer.view.alpha=0.0;
        } completion:^(BOOL finished) {
            ((UIImageView*)recognizer.view).image=nil;
            ((UIImageView*)recognizer.view).alpha=1.0;
        }];
    }];

}

If you set the alpha of view to 0, then your view will not receive any touch event further. So its best practice to set it again to 1.0 after removed the image from UIImageView .

Answer 5

You may want to consider using a UIButton . Detecting touches with these is easy - as is changing their image.

You could also subclass UIControl (see http://www.raywenderlich.com/36288/how-to-make-a-custom-control ).