光滑的圆角 UIView 角，仅底部

Question

这是我试图从我必须使用的模型中模仿的视图：

使用以下代码；

self.plusButton.layer.masksToBounds = true
let maskPathPlus = UIBezierPath(roundedRect: self.plusButton.bounds, byRoundingCorners: [.topRight, .topLeft], cornerRadii: CGSize(width: 4, height: 4))
let maskLayerPlus = CAShapeLayer()
maskLayerPlus.frame = self.plusButton.bounds
maskLayerPlus.path = maskPathPlus.cgPath
plusButton.layer.mask = maskLayerPlus

self.minusButton.layer.masksToBounds = true
self.minusButton.layer.borderColor = UIColor.init(colorLiteralRed: 0.2265625, green: 0.82421875, blue: 0.34765625, alpha: 1.0).cgColor
self.minusButton.layer.borderWidth = 1.0
let maskPathMinus = UIBezierPath(roundedRect: self.minusButton.bounds, byRoundingCorners: [.bottomLeft, .bottomRight], cornerRadii: CGSize(width: 4, height: 4))
let maskLayerMinus = CAShapeLayer()
maskLayerMinus.frame = self.minusButton.bounds
maskLayerMinus.path = maskPathMinus.cgPath
minusButton.layer.mask = maskLayerMinus

我能够做到这一点：

我能做些什么来平滑这些边缘，因为它们似乎只是在使视图的外部边缘变圆并剪裁边框。我不能做一个简单的 .cornerRadius，因为 (-) 的顶部和 (+) 的底部需要平方。

Answer 1

您应该将 + 和 - 按钮放在另一个视图中，并将边框放在包含视图上。然后你可以使用 cornerRadius 属性这对 + 的底部和 - 的顶部没有影响。

@IBOutlet weak var upDownButton: UIView! // Contains the plus and minus buttons, constraints in storyboard

self.upDownButton.layer.borderWidth = 1.0
self.upDownButton.layer.borderColor = UIColor.init(colorLiteralRed: 0.2265625, green: 0.82421875, blue: 0.34765625, alpha: 1.0).cgColor
self.upDownButton.layer.masksToBounds = true
self.upDownButton.layer.cornerRadius = 4.0

我使用约束在容器内布局 +/- 按钮，"equal height" 约束乘数为 0.5。

最终结果将如下所示：

Answer 2

iOS 11 让这更容易

在 iOS 11 中我们有一个名为 CACornermask

的选项

let view = UIView()
view.clipsToBounds = true
view.layer.cornerRadius = 8
view.layer.maskedCorners = [.layerMaxXMaxYCorner, .layerMinXMaxYCorner]

现在我们可以指定需要屏蔽的角。

光滑的圆角 UIView 角，仅底部

Smooth Rounded UIView Corners, Bottom Only

calayer

uiview

ios

uibezierpath

swift