views:

172

answers:

1

I'm trying to place a circular image on an iPhone view and then consume taps inside the circle but not outside of it. The problem I'm running into is that when I place a UIImageView on the screen view in Interface Builder, I seem to be constrained to a rectangular shape. I tried using an image of a circle with the area outside the circle left as transparent but the image in total is still rectangular, so when it's placed on a UIImageView and hooked up to recognize tap gestures it still picks up the taps outside the circle itself.

The image below shows what I mean. The blue dots represent the outer border of the UIImageView that holds the image. The tap gesture recognition is currently linked to that UIImageView but as you can see, there is a bit of space at the corners of the UIImageView that are not covered by the circular image. Is there any way to either conform a UIImageView to a non-rectangular shape or to place an image on a View without using a UIImageView and still be able to hook up tap recognition?

image of walter with transparent background on a UIImageView

I'm pretty new to iPhone graphics but does anyone have some ideas on this or can point me in the right direction?

Thanks!

+1  A: 

Assumes a circle, and not just an oval:

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    CGFloat halfSize = [self bounds].size.width * 0.5f;
    CGPoint location = [[touches anyObject] locationInView:self];
    location.x -= halfSize;
    location.y -= halfSize;
    CGFloat squaredDistanceFromCenter = location.x * location.x + location.y + location.y;
    if (squaredDistanceFromCenter < (halfSize * halfSize)) {
        NSLog(@"Within circle :)");
    } else {
        NSLog(@"Not within circle :(");
    }
}
rpetrich
Thanks for the reply, and I'm assuming that would work. However, what I really wanted to know (and I know now that I should have been more specific with my question) was if it is possible to hook up irregular shaped images to a gesture recognizer. I chose a circular image example thinking (incorrectly) that whatever would work for the smooth edges of a circle could be adapted to a crazy-shaped polygon, but that's not the case. Thanks again for the reply and I'll post a more specific question.
ScottS
If you already have a `CGPath`, you can use `CGPathContainsPoint`. If you have a partially transparent instead of a path, you may want to try rendering it into a buffer and then testing the pixel associated with the touch coordinate.
rpetrich
I found out I can get the CGPoint using CGPoint tapLocation = [recognizer locationInView:self.view]; and this will give me the x,y coordinates of where the user tapped on the image. But right now I don't know how to match up that x,y coordinate with a particular region on my image. I'll post that as a separate question pretty soon if I don't find a way to do it. Perhaps your idea of "rendering it into a buffer and then testing the pixel associated with the touch coordinate" would do the trick, but do you have any more information about how to accomplish that?
ScottS
rpetrich, In case you're interested, here's the link to that new [question][1] [1]: http://stackoverflow.com/questions/3342041/how-to-determine-if-ipad-user-taps-within-an-irregular-shaped-image
ScottS