swift - 自动布局看起来因屏幕尺寸而异

Question

我正在尝试创建一个自定义 UICollectionViewCell。我给了 Cell 本身屏幕本身的高度和宽度:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let width = UIScreen.main.bounds.width * 0.95
    let height = UIScreen.main.bounds.height * 0.5

    return CGSize(width: width, height: height)
}

所以没有固定的数字可以导致这种情况。我的自定义单元格包含 3 个 UILabels 和 3 个 UIImageview。我将 2 个标签和 2 个图像放入一个堆栈中，将另外 2 个放入一个堆栈中，然后将其中 2 个堆栈放入一个堆栈中。这是代码:

    func setupStacks(){
    dislikeImage.frame.size.width = likeImage.frame.width
    dislikeImage.frame.size.height = likeImage.frame.height

    let likesStackView = UIStackView(arrangedSubviews: [likeImage, numberOfLikes, dislikeImage, numberOfDislikes])
    likesStackView.axis = .horizontal
    likesStackView.distribution = .fill
    likesStackView.translatesAutoresizingMaskIntoConstraints = false

    let titleAndImageStack = UIStackView(arrangedSubviews: [postTitle, postImage])
    titleAndImageStack.axis = .vertical
    titleAndImageStack.distribution = .fill
    titleAndImageStack.spacing = 8
    titleAndImageStack.translatesAutoresizingMaskIntoConstraints = false

    let stack = UIStackView(arrangedSubviews: [titleAndImageStack, likesStackView])
    stack.axis = .vertical
    stack.distribution = .fillProportionally
    stack.translatesAutoresizingMaskIntoConstraints = false

    self.contentView.addSubview(stack)
    NSLayoutConstraint.activate([
        likesStackView.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor),
        likesStackView.widthAnchor.constraint(lessThanOrEqualTo: self.contentView.widthAnchor, multiplier: 0.4),
        stack.topAnchor.constraint(equalTo: self.contentView.topAnchor, constant: 8),
        stack.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor, constant: -8),
        stack.centerXAnchor.constraint(equalTo: self.contentView.centerXAnchor),
//            stack.leftAnchor.constraint(equalTo: self.contentView.leftAnchor, constant: 1),
//            stack.rightAnchor.constraint(equalTo: self.contentView.rightAnchor, constant: -1)
            stack.leadingAnchor.constraint(equalToSystemSpacingAfter: self.contentView.leadingAnchor, multiplier: 0.98),
            stack.trailingAnchor.constraint(equalToSystemSpacingAfter: self.contentView.trailingAnchor, multiplier: -0.98)
        ])
    }

问题是它在非 iPhone X 的 iPhone 上看起来很糟糕。例如这是一张图片:

我尝试过，但找不到问题所在以及为什么会发生这种情况。

编辑:更清楚地说，我希望它看起来尽可能接近 iPhone Xs 模拟器，我尝试更改 titleAndImage 堆栈的宽度以及尾随和前导 anchor ，但它不起作用。问题是，如果我将 titleAndImageStack.spacing 更改为尽可能小，标题就会消失，但图像会向两侧延伸，我该如何解决这个问题？

Answer 1

问题是 X 型 iPhone 的长宽比与旧款 iPhone 不同。我通过根据屏幕更改单元格大小来修复它，这不是最优雅的修复方法，但它确实有效。

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let screenHeight = UIScreen.main.nativeBounds.height
    var width: CGFloat!
    var height: CGFloat!

    //iPhone X and above.
    if screenHeight > 2208{
        width = UIScreen.main.bounds.width * 0.95
        height = UIScreen.main.bounds.height * 0.5
    }
    //iPhone Xr
    else if screenHeight == 1792{
        width = UIScreen.main.bounds.width * 0.85
        height = UIScreen.main.bounds.height * 0.45
    }
    //iPhone 8+ and below
    else{
        width = UIScreen.main.bounds.width * 0.85
        height = UIScreen.main.bounds.height * 0.55
    }
    return CGSize(width: width, height: height)
}