Question

我终于得到了我的主要应用程序版本（点击播放MMO - 检查出来;-)）我正在努力扩展它。

要做到这一点，我需要一个有四个单独按钮的圆圈，这些按钮基本上是四分之一。我得出结论，圆形图像需要由四个图像构成，每个四分之一，但由于矩形图像形状的必要性，我最终会有一些重叠，尽管重叠将是透明的。

让这个工作的最佳方法是什么？我需要一些非常简单的东西，我已经看过了 http://iphonedevelopment.blogspot.com/2010/03/irregularly-shaped-uibuttons.html

之前但尚未成功使其发挥作用。有人能提供一些建议吗？

如果它有任何区别，我将部署到iOS 3.X框架（当4.2推出适用于iPad时将是4.2行）

Answer 1

跳过按钮，只需回复包含圆圈的视图中的触摸。

为您要捕获触摸的每个区域创建一个CGPath，当您的UIview接收到触摸时，检查路径内的成员资格。

[编辑回答显示骨架实现细节 - TomH]

以下是我将如何处理这个问题:(我没有测试过这段代码，语法可能不太正确，但这是一般的想法）

1）使用PS或您喜欢的图像创建应用程序，创建一个四分之一圆圈。将它添加到您的XCode项目。

2）向UI添加UIView。将UIView的图层内容设置为png。

self.myView = [[UIView alloc] initWithRect:CGRectMake(10.0, 10.0, 100.0, 100,0)];
[myView.layer setContents:(id)[UIImage loadImageNamed:@"my.png"]];

3）创建描述你感兴趣的UIView中的区域的CGPath。

self.quadrantOnePath = CGPathCreateMutable();
CGPathMoveToPoint(self.quadrantOnePath, NULL, 50.0, 50.0);
CGPathAddLineToPoint(self.quadrantOnePath, NULL, 100.0, 50.0);
CGPathAddArc(self.quadrantOnePath, NULL, 50.0, 50.0, 50.0, 0.0, M_PI2, 1);
CGPathCloseSubpath(self.quadrantOnePath);

// create paths for the other 3 circle quadrants too!

4）添加UIGestureRecognizer并在视图中监听/观察点击

UITapGestureRecognizer *tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleGesture:)];
[tapRecognizer setNumberOfTapsRequired:2]; // default is 1

5）当tapRecognizer调用其目标选择器

时

- (void)handleGesture:(UIGestureRecognizer *) recognizer {

  CGPoint touchPoint = [recognizer locationOfTouch:0 inView:self.myView];
  bool processTouch = CGPathContainsPoint(self.quadrantOnePath, NULL, touchPoint, true);

  if(processTouch) {
     // call your method to process the touch
  }
}

不要忘记在适当时释放所有内容 - 使用CGPathRelease释放路径。

另一个想法：如果用于表示圆形象限的图形只是填充颜色（即没有精美的图形，图层效果等），您还可以使用在UIView的drawRect方法中创建的路径来画出象限。这将解决上述方法的一个缺点：图形与用于检查触摸的路径之间没有紧密集成。也就是说，如果您将图形替换为不同的图形，更改图形的大小等，用于检查触摸的路径将不同步。可能是一段高维护代码。

Answer 2

我看不出，为什么需要重叠。
只需创建4个按钮，并为每个按钮分配一个图像。

在评论后修改

请参阅此great project。一个例子就是你想要做的事情。

它的工作原理是在覆盖的

中加入像素的alpha值

pointInside:withEvent:和UIImage上的一个类别，添加了此方法

- (UIColor *)colorAtPixel:(CGPoint)point {
    // Cancel if point is outside image coordinates
    if (!CGRectContainsPoint(CGRectMake(0.0f, 0.0f, self.size.width, self.size.height), point)) {
        return nil;
    }


    // Create a 1x1 pixel byte array and bitmap context to draw the pixel into.
    // Reference: http://stackoverflow.com/questions/1042830/retrieving-a-pixel-alpha-value-for-a-uiimage
    NSInteger pointX = trunc(point.x);
    NSInteger pointY = trunc(point.y);
    CGImageRef cgImage = self.CGImage;
    NSUInteger width = self.size.width;
    NSUInteger height = self.size.height;
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    int bytesPerPixel = 4;
    int bytesPerRow = bytesPerPixel * 1;
    NSUInteger bitsPerComponent = 8;
    unsigned char pixelData[4] = { 0, 0, 0, 0 };
    CGContextRef context = CGBitmapContextCreate(pixelData, 
                                                 1,
                                                 1,
                                                 bitsPerComponent, 
                                                 bytesPerRow, 
                                                 colorSpace,
                                                 kCGImageAlphaPremultipliedLast | kCGBitmapByteOrder32Big);
    CGColorSpaceRelease(colorSpace);
    CGContextSetBlendMode(context, kCGBlendModeCopy);

    // Draw the pixel we are interested in onto the bitmap context
    CGContextTranslateCTM(context, -pointX, pointY-(CGFloat)height);
    CGContextDrawImage(context, CGRectMake(0.0f, 0.0f, (CGFloat)width, (CGFloat)height), cgImage);
    CGContextRelease(context);

    // Convert color values [0..255] to floats [0.0..1.0]
    CGFloat red   = (CGFloat)pixelData[0] / 255.0f;
    CGFloat green = (CGFloat)pixelData[1] / 255.0f;
    CGFloat blue  = (CGFloat)pixelData[2] / 255.0f;
    CGFloat alpha = (CGFloat)pixelData[3] / 255.0f;
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
}

Answer 3

这是一个很棒的项目，可以很容易地解决不规则形状按钮的问题： http://christinemorris.com/2011/06/ios-irregular-shaped-buttons/

使用不规则形状按钮的简单方法

3 个答案: