如何自动调整 tableview 高度 + stackview

Question

我正在尝试实现此功能：

在表格视图的每个单元格中显示标题、描述和图像。但是，图像可能为零。要求是：

当图像为 nil 时，自动扩展标签以适合整个单元格
Tableview 单元格高度应根据描述标签自动调整。
需要使用stackView

我以编程方式完成了此操作：

设置这是表格视图：

 tableView.rowHeight = UITableView.automaticDimension
 tableView.estimatedRowHeight = 200

创建 2 个 Stackview：一个用于标签，一个用于标签 + 图像：

    let contentStack: UIStackView = {
        var view = UIStackView()
        view.axis = .horizontal
        view.spacing = 16
        view.distribution = .equalSpacing
        view.translatesAutoresizingMaskIntoConstraints  = false
        return view }()
    
    let labelStack: UIStackView = {
        var view = UIStackView()
        view.axis = .vertical
        view.spacing = 5
        view.translatesAutoresizingMaskIntoConstraints = false
        view.distribution = .fillProportionally
        return view }()

使用自动布局设置约束：

func setupUI() {
        contentView.addSubview(contentStack)
        labelStack.addArrangedSubview(titleLabel)
        labelStack.addArrangedSubview(descriptionLable)
        contentStack.addArrangedSubview(labelStack)
        contentStack.addArrangedSubview(iconView)
        
        NSLayoutConstraint.activate([

            iconView.heightAnchor.constraint(equalToConstant: 80),
            iconView.widthAnchor.constraint(equalToConstant: 80),

            contentStack.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 16),
            contentStack.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16),
            contentStack.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16),
            contentStack.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -16)
        ])
        layoutIfNeeded()
    }

但是，此代码不会自动调整 tableview 单元格的高度，您可以从屏幕截图中看到，单元格不会根据标签的长度扩展。

使用 stackview 执行此操作的最佳方法是什么？

这是我目前得到的：

Answer 1

一些变化...

现在，您的 80 磅高度图像视图将 contentStack 高度限制为 80 点，因此在您的 contentStack 设置中，使用以下任一方法：

view.alignment = .top

// or

view.alignment = .center

将您的 labelStack 设置更改为：

view.distribution = .fill   // NOT .fillProportionally

确保设置：

titleLabel.setContentCompressionResistancePriority(.required, for: .vertical)
descriptionLabel.setContentCompressionResistancePriority(.required, for: .vertical)

编辑

这是包含长说明和短说明以及有/没有图像的外观。标签有青色背景，图像视图有黄色背景，所以你可以看到框架...

如果顶部和底部“填充”过多，您需要调整顶部和底部约束常量。

如何自动调整 tableview 高度 + stackview

How to auto resize tableview height + stackview

uitableview

autolayout

uistackview