iOS 上的圆形按钮

Question

是否可以创建如下图所示的两个按钮？看起来似乎应该使用UIButton或UIImageView，但如果我点击区域1，它仍然会像点击按钮1一样操作。当我点击区域1时，也应该触发按钮2！

- glockeruser

---

除非您需要两个操作，否则为什么不将它们作为单个图像封装在一个不可见的按钮中？ - ICL1901

Answer 1

如果以上的解决方案不可行，您可以实现一个自定义的UIButton子类，覆盖pointInside:withEvent:方法。

假设您的视图是正方形的，并且图形恰好是圆形并填充整个正方形，一个示例可能如下：

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
    // check that the point is at least inside the normal rect
    if(![super pointInside:point withEvent:event]) return NO;

    // we'll assume a square view with an exact circle inside, so
    // the radius of the circle is just half the width
    CGFloat radius = self.bounds.size.width*0.5f;

    // the point (radius, radius) is also the centre of the view, so...
    CGFloat squareOfDistanceFromCentre =
          (radius - point.x)*(radius - point.x) +
          (radius - point.y)*(radius - point.y);

    // if the point is too far away, return NO
    if(squareOfDistanceFromCentre > radius*radius) return NO;

    // otherwise we've exhausted possible reasons for answering NO
    return YES;
}

- Tommy

Answer 2

通过裁剪图层并设置按钮的半径，您可以制作圆形按钮。

[[按钮图层] setCornerRadius:8.0f];

您也可以尝试更改半径。

- Wish

---

设置cornerRadius只影响图像，区域1仍可在顶部按钮上单击。 - Bot

Answer 3

将较小的按钮1的userInteractionEnabled设置为NO。所有事件都将转到较大的按钮2。

- bert

Answer 4

我为了这个目的创建了两个圆角矩形按钮，其中一个长而窄，另一个则更加宽阔。它们一起构建成了一个类似胖乎乎的加号形状，考虑到苹果接受44像素作为最小舒适按压尺寸，这种形状相当接近于一个圆。如果你想改变图像，可以为其imageView设置另一个高亮状态的图像并连接两个按钮的多个操作（如果你想在imageview上模仿按钮的高亮状态，则单击操作将不足够）。或者你可以添加观察者，并根据按钮的操作来改变imageview的高亮状态。

- Yunus Nedim Mehel

Answer 5

是的，当然可以。

您可以通过IB将单个操作连接到多个选择器。
您还可以直接从button1触发的方法中调用由button2触发的方法。

- Manlio

Answer 6

这有点棘手，但是可以实现： 您可以只使用一个按钮，但在touchUpInside事件后放置一些验证。您应该计算此触摸点是否在“button1”的圆形内。为了完成此任务，您需要具备一些数学知识 - 如何计算圆周上的点？

- Vov4yk

Answer 7

处理圆形按钮上的pointInside的一种简洁方法是这样的：

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
    if (![super pointInside:point withEvent:event])
    {
        return NO;
    }
    BOOL isInside = (pow((point.x-self.frame.size.width/2), 2) + pow((point.y - self.frame.size.height/2), 2) < pow((self.frame.size.width/2), 2)) ? YES:NO;
    return isInside;
}

你可以放弃'isInside'变量，但这种方式更容易测试。

- averydev