Search code examples
iphoneimagetouchcoordinatesmarkup

how to get touch coordinates in an image then draw a markup icon and its content in a popover view

I would like to built an iPhone/iPad application to show large images (in a scrollView or something else which support dragging and zooming) that allow user to:

  • Touch some where in the image to markup and leave comment
  • User can tap on that markup icon/button to view comment in a popOverView
  • Edit comment or remove that markup

So I want to ask that:

  • How can I get the touch coordinates in image (not screen)?
  • How can I draw a markup icon/button at touch point in the image and it would follow image even when dragging, zooming since the image is really large, maybe up to 8000x6000 pixels?
  • How can I display comment/note when user touch on markup icon/button in a view like popOverview in iPad?
  • Save and load these information.

It is nearly similar to tagging functionality of Facebook App in iPhone.

Any help is appreciated, thank in advance!

Solution

  • 1 . You subclass the UIImageView and override the touch methods:

    • (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

    2 . You add and UIButton to the UIImageView [yourImageView addSubview:yourButton]; then set the center of your button to touch coordinates.

    3 . Just present an popover when user taps on an button. (You can set tag property for buttons to know which button is tapped)

    4 . Save data to an plist to documents directory if is not to complex ore use core data.

    Good Luck. Just post comments if you need more help.

    Edit: you need to set the user userInteractionEnabled to YES for the UIImageView.

    userInteractionEnabled A Boolean value that determines whether user events are ignored and removed from the event queue.

    @property(nonatomic, getter=isUserInteractionEnabled) BOOL userInteractionEnabled Discussion This property is inherited from the UIView parent class. This class changes the default value of this property to NO.

    Availability Available in iOS 2.0 and later. Declared In UIImageView.h

    From UIImageView Class Reference