在 Interface Builder 中设置蒙版角

Question

[.layerMaxXMinYCorner, .layerMinXMinYCorner] 是什么类型的值？是否可以在 Interface Builder 的视图上设置此参数？我知道如何在 Identity Inspector 中设置 layer.borderWidth、layer.borderUIColor 和 layer.cornerRadius，但我无法找出用于蒙版角的正确类型和值。

谢谢！

杰克

更新：这里是每个组合的整数值（四舍五入）：

0:没有圆角
1:左上角
2:右上角
3: 左上角和右上角（两个上角）
4:左下角
5: 左上角和左下角（两个左角）
6:右上和左下
7: 左上角和右上角，左下角（除右下角外的所有角）
8:右下角
9:左上，右下
10: 右上角和右下角（两个右角）
11: 两个上角，右下角（除左下角外的所有角）
12: 左下角和右下角（两个底角）
13:左下角和右下角，左上角（除右上角外的所有角）
14:左下角和右下角，右上角（除左上角外的所有角）
15: 圆角

左上角在 1, 3, 5, 7, 9, 11, 13, 15
右上角在 2-3, 6-7, 10-11, 14-15
左下角在 4-7, 12-15
右下角在8-15
两个顶角都在 3, 7, 11, 15
两个右角都在 10-11, 14,15
两个底角都在 12-15
两个左角都在 5, 7, 13, 15

Answer 1

maskedCorners 是一个 CACornerMask，它是一个 OptionSet，或位掩码。原始值是一个整数：在代码中，您可以尝试打印 someView.layer.maskedCorners.rawValue 的值，或者通过 someView.layer.maskedCorners.setValue(3, forKey: "maskedCorners").

设置它

因此您应该能够在 Interface Builder 中将 layer.maskedCorners 的值设置为整数 3（或您需要的任何值），我不明白为什么这样做会不安全。如果您忘记了，弄清楚整数值实际映射到哪一组角点会很痛苦。

Answer 2

没有检查它是否有效，但你可以尝试 c:

（不要忘记将蒙版应用于您的视图）

@IBDesignable
class ViewController: UIViewController {
    // Preprocessor macro, you won't be able 
    // to use code inside this "if" statement from your... code
    // Just use cornerMask property directly
    #if TARGET_INTERFACE_BUILDER
    @IBInspectable
    var topLeft: Bool = false {
        didSet {
            updateCornerMask()
        }
    }

    @IBInspectable
    var topRight: Bool = false {
        didSet {
            updateCornerMask()
        }
    }

    @IBInspectable
    var bottomLeft: Bool = false {
        didSet {
            updateCornerMask()
        }
    }

    @IBInspectable
    var bottomRight: Bool = false {
        didSet {
            updateCornerMask()
        }
    }

    func updateCornerMask() {
        cornerMask = CACornerMask(
            TL: topLeft,
            TR: topRight,
            BL: bottomLeft,
            BR: bottomRight)
    }
    #endif

    var cornerMask: CACornerMask?
}

extension CACornerMask {
    init(TL: Bool = false, TR: Bool = false, BL: Bool = false, BR: Bool = false) {
        var value: UInt = 0
        if TL { value += 1 }
        if TR { value += 2 }
        if BL { value += 4 }
        if BR { value += 8 }

        self.init(rawValue: value)
    }
}

// And yeah maybe using UIView makes more sense

Answer 3

我只是随机遇到了同样的“问题”并编写了另一个解决方案，在 IB 中为每个角落使用扩展（无子类）和视觉切换（无需手动设置/添加位标志）。

请记住，默认设置为开/true（以便“cornerRadius”影响视图的所有角）。如果你想把除一个角以外的所有角都圆化，只需将那个特定的角设置为 false.

import UIKit

@IBDesignable
public extension UIView {
    @IBInspectable var cornerRadius: CGFloat {
        get { return layer.cornerRadius }
        set { layer.cornerRadius = newValue }
    }

    @IBInspectable var topLeft: Bool {
        get { return layer.maskedCorners.contains(.layerMinXMinYCorner) }
        set {
            if newValue {
                layer.maskedCorners.insert(.layerMinXMinYCorner)
            } else {
                layer.maskedCorners.remove(.layerMinXMinYCorner)
            }
        }
    }

    @IBInspectable var topRight: Bool {
        get { return layer.maskedCorners.contains(.layerMaxXMinYCorner) }
        set {
            if newValue {
                layer.maskedCorners.insert(.layerMaxXMinYCorner)
            } else {
                layer.maskedCorners.remove(.layerMaxXMinYCorner)
            }
        }
    }

    @IBInspectable var bottomLeft: Bool {
        get { return layer.maskedCorners.contains(.layerMinXMaxYCorner) }
        set {
            if newValue {
                layer.maskedCorners.insert(.layerMinXMaxYCorner)
            } else {
                layer.maskedCorners.remove(.layerMinXMaxYCorner)
            }
        }
    }

    @IBInspectable var bottomRight: Bool {
        get { return layer.maskedCorners.contains(.layerMaxXMaxYCorner) }
        set {
            if newValue {
                layer.maskedCorners.insert(.layerMaxXMaxYCorner)
            } else {
                layer.maskedCorners.remove(.layerMaxXMaxYCorner)
            }
        }
    }
}

Answer 4

在界面构建器中，我通过在运行时间选择要转换的对象来设置这些，在用户定义的运行time 属性中，KeyPath 是 layer.cornerRadius 或 layer.maskedCorners 类型为 Number 并添加要更改的角的原始值。

在 Interface Builder 中设置蒙版角

Setting masked corners in Interface Builder

interface-builder

uiview

ios