使用约束约束时按钮的角不保持圆角

Question

我在堆栈视图中有两个按钮。我使用了 UIButton 的扩展来圆外角。这适用于我在情节提要中设计的 7Plus，但是一旦我在模拟器中运行较小的设备尺寸，它就会停止工作，我只能在任一按钮的左侧而不是右侧圆角。有什么想法吗？

在 7Plus 上

在 7

这些是我正在使用的扩展

extension CGSize{
    init(_ width:CGFloat,_ height:CGFloat) {
        self.init(width:width,height:height)
    }
}
extension UIButton{
    func roundOneSide(topCorner: UIRectCorner, bottomCorner: UIRectCorner){
        let maskPAth1 = UIBezierPath(roundedRect: self.bounds,
                                 byRoundingCorners: [topCorner , bottomCorner],
                                 cornerRadii:CGSize(6.0, 6.0))
        let maskLayer1 = CAShapeLayer()
        maskLayer1.frame = self.bounds
        maskLayer1.path = maskPAth1.cgPath
        self.layer.mask = maskLayer1
    }
}

我也尝试了以下代码，但无济于事。只有当约束起作用时，它才能成功地绕过左边的角落。

    let maskLayer = CAShapeLayer()
    maskLayer.path = UIBezierPath(roundedRect: view.bounds, byRoundingCorners: [.topLeft, .bottomRight], cornerRadii: CGSize(width: 6, height: 6)).cgPath
    facebookBtn.layer.mask = maskLayer
    facebookBtn.layer.masksToBounds = true

Answer 1

使用你像生涩所说的那样使用段控制或 试试下面的代码：

// 登录按钮

   UIBezierPath *cornersPathLeft = [UIBezierPath bezierPathWithRoundedRect:buttonLogin.bounds  byRoundingCorners:(UIRectCornerBottomLeft|
UIRectCornerTopLeft) cornerRadii:CGSizeMake(5, 5)];

    //Create a new layer to use as a mask

    CAShapeLayer *maskLayerLeft = [CAShapeLayer layer];

    // Set the path of the layer 

    maskLayerLeft.path = cornersPathLeft.CGPath;
    buttonLogin.layer.mask = maskLayerLeft;

//对于FB按钮

    UIBezierPath *cornersPathRight = [UIBezierPath bezierPathWithRoundedRect:buttonFB.bounds  byRoundingCorners:(UIRectCornerTopRight|
UIRectCornerBottomRight) cornerRadii:CGSizeMake(5, 5)];

    CAShapeLayer *maskLayerRight = [CAShapeLayer layer];
    maskLayerRight.path = cornersPathRight.CGPath;
    buttonFB.layer.mask = maskLayerRight;

注意：

做maskToBounds = true 它允许对图层产生影响。

-

MaskToBounds 和 ClipsToBounds 的区别

MaskToBounds

层的任何延伸到其边界之外的子层都将被剪裁到这些边界。在这种情况下，将图层视为其子图层的窗口；窗口边缘之外的任何东西都将不可见。当masksToBounds = NO 时，不会发生剪辑。

当此属性的值为true 时，Core Animation 会创建一个隐式剪切蒙版，该蒙版匹配图层的边界并包含任何角半径效果。如果还指定了掩码属性的值，则将两个掩码相乘得到最终掩码值。

ClipsToBounds

clipsToBounds 的用例更多用于部分位于主视图之外的子视图。

例如，我在其父（矩形）UIView 的边缘有一个（圆形）子视图。如果将 clipsToBounds 设置为 YES，则只会显示一半的圆/子视图。如果设置为 NO，则会显示整个圆圈。刚好遇到这个，想分享一下

结论

MaskToBounds 适用于任何视图的子层。就像这里 OP 在按钮上添加了层，但它没有产生效果。我的意思是层的边界不正确。

ClipToBounds 应用于任何视图的 subVies。假设您有一个视图（例如 viewBG），并且现在您添加了另一个视图（例如，upperView），现在您不想看到上视图以查看 viewBG 之外。 ViewUpper 总是在其父视图内。所以在这种情况下，你必须设置 clipstobounds。

实践经验

在 swift 中试试下面的代码

let viewBG : UIView = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
        viewBG.backgroundColor = UIColor.lightGray

        self.view.addSubview(viewBG)

        let viewUpper : UIView = UIView(frame: CGRect(x: -50, y: -50, width: 100, height: 100))
        viewUpper.backgroundColor = UIColor.blue
        viewBG.addSubview(viewUpper)

输出 1. 当我完成viewBG.clipsToBounds = false

1. 当我完成viewBG.clipsToBounds = true

Answer 2

你需要在storyboard中开启按钮的clipToBound属性；

Answer 3

您可以尝试一种不同的、非常简单的方法来弯曲 UIButton 或 Label 的角。

1. 点击按钮
2. 点击身份检查器
3. 然后在标识部分添加一个属性
4. 密钥路径是layer.cornerRadius
5. 设置为数字
6. 最后给个值，值越高，边角越圆。

Answer 4

嗯，这很容易解决。我只需要在 viewWillLayoutSubviews 中圆角。

override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    loginBtn.roundOneSide(topCorner: .topLeft, bottomCorner: .bottomLeft)
    facebookBtn.roundOneSide(topCorner: .topRight, bottomCorner: .bottomRight)
}