Question

I have an image and I would like to have it so when I click on a section of the image, only that section highlights. At present to test this, I have set up an application and placed an image view on the back. I just created an image and wrote 1,2,3 and 4 on it. I then used a UIView to draw a horizontal and vertical line through the image

I have set up a on tap gesture listener and that prints out which section I have hit. Code below

- (void)handleSingleTap:(UITapGestureRecognizer *)recognizer
{
    // Get the location of the touch
    CGPoint touchPoint = [recognizer locationOfTouch:0 inView:[self view]];

    if(touchPoint.x > 10 && touchPoint.x < 160)
    {

        if(touchPoint.y > 30 && touchPoint.y < 220)
        {
            NSLog(@"Button 1");


        }else if(touchPoint.y > 220 && touchPoint.y < 430){
            NSLog(@"Button 3");
        }

    }else if(touchPoint.x > 160 && touchPoint.x < 310)

    {
        if(touchPoint.y > 220 && touchPoint.y < 430)
        {
           NSLog(@"Button 4");
        }else if(touchPoint.y > 30 && touchPoint.y < 220){
            NSLog(@"Button 2");
        }

    }

   //For debugging
   // NSLog(@"x = %f y = %f", touchPoint.x, touchPoint.y);
}

Now what I want to happen is when I click on a particular section, I want just that part of the image to highlight. Is this possible? At present the workaround I am using is adding 4 buttons on top of the grid which are hidden for normal state, and give them an image for highlighted state like this

[button setBackgroundImage:[UIImage imageNamed:@"highlightImage.png"] forState:UIControlStateHighlighted];

And set the alpha to 0.5 or somewhere around that, so it looks like that section is being highlighted. If this is the only way it can be done, then just leave an answer saying so and I will accept it, but I would prefer a more concrete solution if one is available!! Thanks in advance

Example of image created

Answer 1

Looks like the right approach.

Maybe you should use less hard coded numbers in your code and implement this functionality on a more general level (e.g., using the frame property of the image view or buttons).