创build一个具有圆顶的UIView

我想创build一个像这个图像圆顶的UIView，我该怎么做？

想要的结果

不想要的结果

Answer 1

重新发布一个答案，我张贴在不同的线程：

我现在可以确认这是在iOS 6之后引入的一个错误。我有一个运行iOS 6.1的老4s。 在那台机器上，这个代码：

path = [UIBezierPath bezierPathWithRoundedRect: bounds byRoundingCorners: UIRectCornerTopLeft | UIRectCornerTopRight cornerRadii: CGSizeMake(bounds.size.width/2, bounds.size.width/6) ]; 

创build一个椭圆形angular落的圆angular矩形。 曲线顶部的曲线更平缓，两边更清晰，如您所期望的那样：

这是iOS 6.1的形象，应该是这样的：

以下是从iOS 8.1.2运行时的相同代码：

看起来，在iOS> = 7.0上，它忽略了指定半径的高度，并使用angular度椭圆的高度和宽度的宽度值，这迫使它们始终为四分之一圆。

我已经logging了一个苹果bug记者系统的错误。 我们会看看他们说什么 我build议所有看到这个问题的人也报告一个bug。 他们得到的报告越多，他们修复的可能性就越大。

（忽略底部的UISwitch，这是以前的testing结果）。

编辑：我写了代码，build立一个贝塞尔曲线，大致接近的iOS曲线生成的曲线<7。我刚刚find一篇关于贝塞尔曲线近似圆的文章 。 使用这篇文章中的控制点，我们不难构build自己的bezierPathWithRoundedRect:byRoundingCorners:cornerRadii:等价物bezierPathWithRoundedRect:byRoundingCorners:cornerRadii:适用于所有iOS版本的方法。

Answer 2

正确的做法（或正确的方法之一）是使用UIBezierCurve的addQuadCurveToPoint:controlPoint 。 你可以从任何path到点的地方绘制一条二次曲线，使用另一个点作为控制点，这是确定最终path将具有多less弧和曲线的方式。 不要忘记，如果你使用一个图层作为蒙版，你也必须绘制矩形部分的形状，否则蒙版将只是曲线。

Answer 3

故事板中也有一个简单的方法。

1. 创build一个没有背景颜色的UIView（clearColor）。
2. 在这个视图里面，用你需要的bg颜色创build另外两个视图。
3. 将一个视图置于另一个视图之上，转到右侧面板中的Identity Inspector。 并在用户定义的运行时属性部分添加“layer.cornerRadius = desiredRadius ”。
4. 你现在有两个bg颜色的视图。 一个有圆angular和一个没有，只需调整他们的位置，以实现你的外观，就是这样。 不需要编码。

Answer 4

一旦我在SO的某个地方发现了这个 它工作很好。 这里是代码：

 -(UIView *)roundCornersOnView:(UIView *)view onTopLeft:(BOOL)tl topRight:(BOOL)tr bottomLeft:(BOOL)bl bottomRight:(BOOL)br radius:(float)radius { if (tl || tr || bl || br) { UIRectCorner corner = (bl ? UIRectCornerBottomLeft : 0) | (br ? UIRectCornerBottomRight : 0) | (tl ? UIRectCornerTopLeft : 0) | (tr ? UIRectCornerTopRight : 0); UIView *roundedView = view; UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:roundedView.bounds byRoundingCorners:corner cornerRadii:CGSizeMake(radius, radius)]; CAShapeLayer *maskLayer = [CAShapeLayer layer]; maskLayer.frame = roundedView.bounds; maskLayer.path = maskPath.CGPath; roundedView.layer.mask = maskLayer; return roundedView; } else { return view; } } 

让你的视图名称是_tView，然后调用：

 _tView = (UIView *)[self roundCornersOnView:_tView onTopLeft:YES topRight:YES bottomLeft:NO bottomRight:NO radius:25.0]; 

这会给出这样的输出：

Answer 5

这个答案真的帮助我通过这段代码实现了这个效果：

Swift 3.1

 extension UIView { func addBottomRoundedEdge(desiredCurve: CGFloat?) { let offset: CGFloat = self.frame.width / desiredCurve! let bounds: CGRect = self.bounds let rectBounds: CGRect = CGRect(x: bounds.origin.x, y: bounds.origin.y + bounds.size.height / 2, width: bounds.size.width, height: bounds.size.height / 2) let rectPath: UIBezierPath = UIBezierPath(rect: rectBounds) let ovalBounds: CGRect = CGRect(x: bounds.origin.x - offset / 2, y: bounds.origin.y, width: bounds.size.width + offset, height: bounds.size.height) let ovalPath: UIBezierPath = UIBezierPath(ovalIn: ovalBounds) rectPath.append(ovalPath) // Create the shape layer and set its path let maskLayer: CAShapeLayer = CAShapeLayer() maskLayer.frame = bounds maskLayer.path = rectPath.cgPath // Set the newly created shape layer as the mask for the view's layer self.layer.mask = maskLayer } }