ios - iOS 中的自定义 View 大小不是动态的

Question

一周前，我刚刚在 iOS 上启动了我的第一个应用程序。我使用 AppleDeveloperWebsite Custom Rating Control Tutorial 创建了一个自定义 View 以在我的应用程序中使用它。

现在我在 Storyboard中选择了 iPhone7 设备，我在 iPhone 7 模拟器上运行它，它运行得很好，但是当我在 iPhone 5 模拟器上运行它时(屏幕大小发生变化)，我的自定义 View 超出了屏幕。当我设置约束时，我所有其他控件的大小都会调整大小，但只有我的自定义 View 大小会弄乱。

请帮忙

import UIKit

@IBDesignable class xRadioButtonView: UIView {
var button: UIButton!
var label: UILabel!

@IBInspectable var text: String? {
    didSet{
        label.text = text
    }
}

//Properties
var isSelected = 0

//Initialization
override init(frame: CGRect){
    super.init(frame: frame)
    addSubviews()
}

required init(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)!
    addSubviews()
}

func addSubviews() {
    self.backgroundColor = UIColor.white

    let xWidth = bounds.size.width
    let xHeight = bounds.size.height

    let tap = UITapGestureRecognizer(target: self, action: #selector(xRadioButtonView.radioButtonTextTapped))

    button = UIButton(frame: CGRect(x: 1, y: 1, width: xWidth - 2, height: xHeight - 4))
    button.backgroundColor = UIColor.white
    button.addTarget(self, action: #selector(xRadioButtonView.radioButtonTapped(button:)), for: .touchDown)

    addSubview(button)

    label = UILabel(frame: CGRect(x: 1, y: 1, width: xWidth - 2, height: xHeight - 2))
    label.textColor = UIColor.init(hex: "#D5D5D5")
    //label.font = UIFont.init(name: label.font.fontName, size: 25)
    //label.font = label.font.withSize(25)
    label.font = UIFont.boldSystemFont(ofSize: 25)
    label.textAlignment = NSTextAlignment.center
    label.isUserInteractionEnabled = true
    label.addGestureRecognizer(tap)

    addSubview(label)
}

override func layoutSubviews() {
    // Set the button's width and height to a square the size of the frame's height.

}

override func prepareForInterfaceBuilder() {
    super.prepareForInterfaceBuilder()
    label.text = "xRBV"
}

func radioButtonTapped(button: UIButton) {
    if isSelected == 0 {
        isSelected = 1
        self.backgroundColor = UIColor.init(hex: "#00BFA5")
        label.textColor = UIColor.init(hex: "#00BFA5")
    } else {
        isSelected = 0
        self.backgroundColor = UIColor.white
        label.textColor = UIColor.init(hex: "#D5D5D5")
    }
}

func radioButtonTextTapped(sender: UITapGestureRecognizer){
    if isSelected == 0 {
        isSelected = 1
        self.backgroundColor = UIColor.init(hex: "#00BFA5")
        label.textColor = UIColor.init(hex: "#00BFA5")
    } else {
        isSelected = 0
        self.backgroundColor = UIColor.white
        label.textColor = UIColor.init(hex: "#D5D5D5")
    }
}
}

如您所见，PG 按钮应该在绿色结束但白色按钮超出屏幕的地方结束

Answer 1

要么需要在 layoutSubViews 中设置 frame，要么需要在代码中实现自动布局:

    button = UIButton(frame: CGRect(x: 1, y: 1, width: xWidth - 2, height: xHeight - 4))
    button.backgroundColor = UIColor.white
    button.addTarget(self, action: #selector(xRadioButtonView.radioButtonTapped(button:)), for: .touchDown)
    addSubview(button)
    button.translatesAutoresizingMaskIntoConstraints = false
    let attributes: [NSLayoutAttribute] = [.top, .bottom, .leading, .trailing]
    let constants = [2, 2, 10, 10]  // 2 from top and bottom, 10 from leading and trailing
    NSLayoutConstraint.activate(attributes.enumerated().map { NSLayoutConstraint(item: button, attribute: $1, relatedBy: .equal, toItem: button.superview, attribute: $1, multiplier: 1, constant: constants[$0]) })

该示例使用旧方法，因为您的约束是统一的，但如果您有更复杂的东西，从 iOS 9 开始使用 NSLayoutAnchor 通常更简单。

编辑:如果有人感兴趣，这里是元组的代码:

    button.translatesAutoresizingMaskIntoConstraints = false
    let attributes: [(NSLayoutAttribute, CGFloat)] = [(.top, 2), (.bottom, 2), (.leading, 12), (.trailing, 12)]
    NSLayoutConstraint.activate(attributes.map { NSLayoutConstraint(item: button, attribute: $0.0, relatedBy: .equal, toItem: button.superview, attribute: $0.0, multiplier: 1, constant: $0.1) })