Question

I have a view with an imageview and a tableview below it. The imageview contains an image of a human body. Now what I’d like to do is to separate the image into three portions: The head, the thorax and the abdominal cavity. The tableview also has three rows, each corresponding to the sections of the body mentioned above.When I select or click any of these regions I want to scroll through the corresponding rows of the table and navigate to another viewcontroller which will serve as a detail view controller. So let’s say I choose head, I want to navigate to another page that explains head in detail. I get the same effect when I select any of the rows.

Answer 1

You can easily do this using a UITapGestureRecognizer instance attached to the image view. First off, you will have to set the UIImageView‘s userInteractionEnabled to YES. After attaching the gesture recognizer, you should resolve the touch to its region in the gesture handler.

- (void)tap:(UITapGestureRecognizer *)tapGesture {
    CGPoint locationInView = [tapGesture locationInView:tapGesture.view];

    /* Resolve the location here */
}

Now resolution is based on how you will define the regions. If they are just rectangles, declare three CGRect objects as instance variables and set them appropriately and do something like this,

if ( CGRectContainsPoint(headRect, locationInView) ) {
    /* It's a head, load its view controller */
} else if ( ... ) {
    ....

Or if the regions are a bit more complicated, use UIBezierPath or CGPathRef.