设置框架时视图错位

Question

我正在尝试用程序制作一个视图，制作一张带有图像和一些文本的卡片，并用一些颜色覆盖它。我已经关闭了剪辑到边界，并添加了一些颜色，使其更直观。所以当我设置时

overlay.frame = self.frame

或

overlay.frame = CGRect(x: 0, y: 0, width: frame.width, height: frame.height)

覆盖应该覆盖整个视图，但它没有，为什么会这样？

这就是显示的内容

这是我想看到的，但每张卡的顶部都有一层蓝色

private var leftImage: UIImageView = {
let i = UIImageView(frame: .zero)
i.contentMode = .scaleAspectFill
i.image = UIImage()
return i
}()
private var topLabel: UILabel = {
let label = UILabel(frame: .zero)
label.isUserInteractionEnabled = false
label.font = UIFont.boldSystemFont(ofSize: 16.0)
label.lineBreakMode = .byWordWrapping
label.adjustsFontSizeToFitWidth = true
label.numberOfLines = 2
return label
}()
var bottomLabel: UILabel = {
let label = UILabel(frame: .zero)
label.isUserInteractionEnabled = false
label.lineBreakMode = .byWordWrapping
label.font = UIFont.systemFont(ofSize: 12.0)
label.numberOfLines = 1
label.text = "60 seconds"
return label
}()
private var stackView: UIStackView = {
let stack = UIStackView(frame: .zero)
stack.axis = .vertical
stack.isUserInteractionEnabled = false
stack.distribution = .fillEqually
stack.layoutMargins = UIEdgeInsets(top: 5, left: 5, bottom: 5, right: 5)
stack.isLayoutMarginsRelativeArrangement = true
return stack
}()
private var overlay: UIView = {
let view = UIView(frame: .zero)
view.backgroundColor = .blue
view.alpha = 0.8
//view.isHidden = true
return view
}()

override init(frame: CGRect) {
super.init(frame: frame)
create()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
create()
}


private func create() {
self.translatesAutoresizingMaskIntoConstraints = false
//leftview
leftImage.frame = CGRect(x: 0, y: 0, width: frame.width / 2, height: frame.height)
addSubview(leftImage)
//rightVIew
stackView.frame = CGRect(x: frame.midX, y: 0, width: frame.width / 2, height: frame.height)
clipsToBounds = false

//add views to stack
stackView.addArrangedSubview(topLabel)
stackView.addArrangedSubview(bottomLabel)

addSubview(stackView)
overlay.frame = CGRect(x: 0, y: 0, width: frame.width, height: frame.height)
addSubview(overlay)
//card styling
layer.cornerRadius = 10
}

Answer 1

overlay.frame = self.frame

除非偶然，否则这永远不会是正确的，因为overlay的frame和self的frame位于两个不同的坐标系中。至少你想说

overlay.frame = self.bounds // bounds, not frame

然而，除非你在正确的地方说出来，否则这也不会奏效。正确的位置是布局发生时：

override func layoutSubviews() {
super.layoutSubviews()
self.overlay.frame = self.bounds
}

只需将其添加到现有代码中就可以解决问题。

Answer 2

问题是您将覆盖层的尺寸设置为：

overlay.frame = CGRect(x: 0, y: 0, width: frame.width, height: frame.height)

在超级视图确定其最终宽度和高度之前。您需要执行以下操作之一：

1. 在超视图类确定其最终大小后调用create()
2. 随着超级视图的宽度和高度的变化，不断设置覆盖的框架(请参见https://developer.apple.com/documentation/uikit/uiview/1622482-layoutsubviews)
3. 通过xib/情节提要文件使用自动布局约束