iOS Interactivity on UIImageView

[rameshmrthy]

I am newbie working on iOS application for iPad. I have successfully implemented a children's book app using UIImageView. I have also implemented swipe gestures to traverse across the pages. Each page is loaded as single image inside UIImageView and plays an audio narrating the scene.

Now I would like to add some interactivity to my pages. For example, I have a single image loaded in UIImageView which contains few animal characters and some dialect for that particular scene... I want whenever user tap on a particular animal, my app should play a audio file containing that animal's sound... how can I achieve this functionality? I need to understand the concept so I can implement it. Should I be having separate images for all animals and load them in their own UIImageView and have all these UIImageViews inside main (or background) UIImageView? I would appreciate if someone can explain me the concept of how such functionality should be implemented.

 

[Sydde]

You get to learn about subclassing! In other words, to do what you want to do, you have to subclass UIImageView. Except, you will not be overriding any UIImageView methods, instead you will be overriding methods of its superclass, UIResponder. Look at the methods that begin with "touches" and figure out which ones you will need to implement in your subclass to get the behavior you want.

At this point, you need to figure out how to locate your animals in each picture. The easiest way involves using NSRect structs (which are NOT NSObjects, rather, C structures) to approximate the locations of animals and somehow associate these rects with the appropriate images (for instance, by encapsulating them with the image in an object of your design).

Look up the list of functions in the Foundation reference to see how to site a point in a rectangle for testing hits. Finally, you will need to figure out how to differentiate a tap from a swipe so that the viewer can advance frames even if their finger lands on an animal.

Good Luck.

 

[dejo]

In other words, to do what you want to do, you have to subclass UIImageView.

Well, you don't have to. (Although it definitely seems like a good approach). Another way would be to add invisible buttons as subviews over top the desired animals.

 

[rameshmrthy]

dejo,

I am also working in the direction of adding invisible buttons on top of animal characters in my image and play corresponding audio file. I hope this can be achieved easily on UIImageView.

My other bigger question is, how can I simulate some animation (as if LION is opening and closing his mouth while roaring) when user tap/click on the animal character? Can this be achieved with my current approach of UIImageView or do I have to get into core animations and use CA layers etc.