Question

我想以编程方式将屏幕划分为三个部分。每个部分都应是带有backgroundColor的标签，宽度设置为：

// Get the device width
self.view.bounds.width

高度必须是动态的。一个例子如下图所示。每种颜色都是一个部分。第一部分（红色部分）必须连接到顶部，最后一部分（橙色）必须连接到底部。并且取决于每个部分内的标签尺寸，应调整高度。

蓝色部分始终为100％，并且取决于它从蓝色部分中减去的红色和橙色部分。

任何人对如何实现这一点都有任何想法？感谢帮助！

Answer 1

要做到这一点，最好使用NSLayoutConstraint来使用AutoLayout。这里有一些示例代码（目前这一切都在viewDidLoad，这可能不是最好的事情，但我会留给你组织代码。）

override func viewDidLoad() {
    super.viewDidLoad()

    //  1.
    var topView: UIView = self.view

    // Have as many labels as you want!
    for i in 0..<numberOfLabels {
        let label = UILabel()

        //  2.
        label.numberOfLines = 0
        label.setTranslatesAutoresizingMaskIntoConstraints(false)
        self.view.addSubview(label)

        //  3.
        if i == 0 || i == numberOfLabels - 1 {
            label.setContentHuggingPriority(UILayoutPriority.abs(1000), forAxis: UILayoutConstraintAxis.Vertical)
        }

        let widthConstraint = NSLayoutConstraint(item: label, attribute: .Width, relatedBy: .Equal, toItem: self.view, attribute: .Width, multiplier: 1.0, constant: 0.0)
        //  4.
        let heightConstraint = NSLayoutConstraint(item: label, attribute: .Height, relatedBy: .GreaterThanOrEqual, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 20.0)

        //  5.
        let attribute: NSLayoutAttribute = i == 0 ? .Top : .Bottom
        let topConstraint = NSLayoutConstraint(item: label, attribute: .Top, relatedBy: .Equal, toItem: topView, attribute: attribute, multiplier: 1, constant: 0)

        //  6.
        if i == numberOfLabels - 1 {
            let bottomConstraint = NSLayoutConstraint(item: label, attribute: .Bottom, relatedBy: .Equal, toItem: self.view, attribute: .Bottom, multiplier: 1, constant: 0)

            self.view.addConstraint(bottomConstraint)
        }

        label.addConstraint(heightConstraint)

        self.view.addConstraint(widthConstraint)
        self.view.addConstraint(topConstraint)

        topView = label
    }
}

1。 topView是label的{{1}}与之相关的视图。例如：第一个标签的顶部与其容器视图相关;第二个标签的顶部与第一个标签有关;第三个标签的顶部与第二个视图相关，依此类推。

2. ：将行数设置为零，以允许NSLayoutAttribute.Top所需的行数。

3. 将顶部和底部标签的内容拥抱优先级设置为label.text。这将导致顶部和底部标签“拥抱”文本，因为默认情况下，中间标签的拥抱优先级为1000。

4。创建一个250，将NSLayoutConstraint设置为高于20分，因为label会自动设置preferredMaxLayoutWidth的宽度和高度标签必须由NSLayoutConstraint s明确定义。

5. 这会选择topView上将label固定到topView的属性。例如：如果创建第一个label，则其顶部固定在容器视图的顶部。否则，label的顶部将固定在其上方标签的底部。

6. 如果它是最后一个标签，请将其底边固定在容器视图的底部。

结果如下：

enter image description here

希望能回答你的问题。

Swift自动布局多个视图/标签

1 个答案: