How to create hotlinks on image?

Question

I'm not sure what the iPhone version of this is called but in HTML it is an image map. Certain areas of the map route you to different pages. I'd like to use an image, mostly in a scrollview, that I can have certain areas perform different actions. For example, Chemical Touch, http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=288060442&mt=8, does this. Click on an element and it grows in size to reveal more details. What is this type of technique called and how is it created?

I'd like to be a little more interactive with the user, how can I do any of these:

• drop map pins onto this image
• display a UITextField depending if I have text in that area
• overlay text depending on user actions

Any suggestions here are greatly appreciated.

Answer 1

What you basically need to do is override any or all of:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event;
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event;
- (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event;

in your UIView subclass (or actually any subclass of UIResponder). Then you can handle the event however you wish, such as doing any of the things you mentioned in your question.

For example, here is Apple's sample code for a simple event handler:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    UITouch* touch = [touches anyObject];
    NSUInteger numTaps = [touch tapCount];
    if (numTaps < 2) {
        [self.nextResponder touchesBegan:touches withEvent:event];
   } else {
        [self handleDoubleTap:touch];
   }
}

The Event Handling section in the iPhone Application Programming Guide should give you all the info you need to get started.