自定义创建的视图大小不会根据约束而改变

Question

我已经构建了一个自定义视图，该视图需要嵌入到各个地方。

这是我和代码一起做的：

1）创建了一个Swift文件和一个名为CustomLabel的xib文件。 CustomLabel.swift的内容：

import UIKit

class CustomLabel: UIView {

@IBOutlet var view: UIView!
@IBOutlet weak var label: UILabel!

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    print("CustomLabel")
    Bundle.main.loadNibNamed("CustomLabel", owner: self, options: nil)


    self.addSubview(self.view)
}



}

CustomLabel.xib的外观如下：

我已将视图设为自由形式并设置其高度。我在其中添加了一个标签视图，在所有四个方面都有约束。

现在，我将此视图添加到我的Main ViewController中，但是将此视图的宽度设置为大于原始可重用视图。

这是结果：

黄色背景显示了该视图的额外宽度，黑色背景是原始视图。

我如何确保可重用视图被拉伸以覆盖整个视图？

Answer 1

加载XIB的方式会创建 两个 UIView对象，您可能会认为它只能创建一个。

您可以使用Debug View Hierarchy

轻松查看

在这里，蓝色视图是添加到情节提要中的视图，通常设置了约束（在这种情况下，每侧40点，高度为100，垂直居中）。

红色视图是您在设计XIB时使用的视图，它具有黑色背景的标签，在所有四个侧面上均约束为0。

您的XIB 类是UIView，因此它是它的自己视图...当您向情节提要中添加UIView并将其类设置为CustomLabel，即成为“根”视图。在您的代码中，您正在添加 view作为子视图...这应该可以为您提供提示，现在您有两个 UIView对象。

现在发生的是，CustomLabel本身（它是UIView）使用您在情节提要中设置的约束，但是view子视图却不显示 设置了约束。

如果您将加载代码更改为此（我更改了您的IBOutlet名称，因为将“视图”作为子视图添加到另一个“视图”会变得非常混乱）：

class CustomLabel: UIView {

    @IBOutlet var theView: UIView!
    @IBOutlet weak var thelabel: UILabel!

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        print("CustomLabel")
        Bundle.main.loadNibNamed("CustomLabel", owner: self, options: nil)

        self.addSubview(self.theView)

        self.theView.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            self.theView.topAnchor.constraint(equalTo: self.topAnchor, constant: 0.0),
            self.theView.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0.0),
            self.theView.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 0.0),
            self.theView.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: 0.0),
            ])

    }

}

现在，您的代码从XIB加载视图，将其添加为CustomLabel（同样是UIView本身）的子视图，并按预期设置约束，得到以下结果：

如您所见，已经添加为子视图的theView（此图中的红色）现在被限制为其父视图，即蓝色的CustomLabel。