UITableView单元格自动布局约束

• 白色区域是表的背景
• 紫色是类别标题(这可以使用很少或最多的紫色区域)
• 绿色是一个水平的UICollectionView,但是每个表行可以有不同的集合视图高度(注意第1行和第2行之间的差异;第3行在屏幕底部被截断)
• 粉红色的线是行分隔符

到目前为止,我已经创建了以下类

import UIKit

class CategoryRowCell: UITableViewCell {
    let gradient = GradientView()
    let titleLbl = UILabel()
    let viewAllBtn = UIButton(type: .custom)
    let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: 0, height: 0), collectionViewLayout: UICollectionViewFlowLayout())

    override func awakeFromNib() {
        super.awakeFromNib()
    }

    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.setupCategoryViews()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    override func prepareForReuse() {
        titleLbl.text = ""
        viewAllBtn.removeTarget(nil, action: nil, for: .allEvents)
        collectionView.setContentOffset(.zero, animated: false)
    }

    func setupCategoryViews() {
        //Title
        titleLbl.textColor = .white
        titleLbl.numberOfLines = 1
        titleLbl.textAlignment = .left
        titleLbl.translatesAutoresizingMaskIntoConstraints = false
        addSubview(titleLbl)

        //View All
        viewAllBtn.titleLabel?.textColor = .white
        viewAllBtn.setTitle("View All", for: .normal)
        viewAllBtn.translatesAutoresizingMaskIntoConstraints = false
        addSubview(viewAllBtn)

        //Collection View
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.estimatedItemSize = UICollectionViewFlowLayout.automaticSize
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        collectionView.showsVerticalScrollIndicator = false
        collectionView.showsHorizontalScrollIndicator = false
        collectionView.bounces = false
        collectionView.collectionViewLayout = layout
        collectionView.isScrollEnabled = true
        collectionView.backgroundColor = .clear
        addSubview(collectionView)


        let titleConstraints = [
            titleLbl.topAnchor.constraint(equalTo: topAnchor, constant: 16),
            titleLbl.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 16),
            titleLbl.trailingAnchor.constraint(equalTo: viewAllBtn.leadingAnchor)
        ]
        NSLayoutConstraint.activate(titleConstraints)

        let viewAllBtnConstraints = [
            viewAllBtn.leadingAnchor.constraint(equalTo: titleLbl.trailingAnchor, constant: 16),
            viewAllBtn.centerYAnchor.constraint(equalTo: titleLbl.centerYAnchor)
        ]
        NSLayoutConstraint.activate(viewAllBtnConstraints)

        let collectionViewConstraints = [
            collectionView.topAnchor.constraint(equalTo: titleLbl.bottomAnchor, constant: 16),
            collectionView.leadingAnchor.constraint(equalTo: self.leadingAnchor),
            collectionView.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: -16),
            collectionView.trailingAnchor.constraint(equalTo: self.trailingAnchor),
            collectionView.heightAnchor.constraint(equalToConstant: 150)
        ]
        NSLayoutConstraint.activate(collectionViewConstraints)
    }

    func setCollectionViewDataSourceDelegate<D: UICollectionViewDelegate & UICollectionViewDataSource>(_ dataSourceDelegate: D, forRow row: Int) {
        collectionView.delegate = dataSourceDelegate
        collectionView.dataSource = dataSourceDelegate
        collectionView.tag = row
        collectionView.reloadData()
    }
}

好吧,那么我的问题是是:-

红色视图所有区域未固定在屏幕右侧。相反,它被固定在紫色视图的右边缘(没有间隙)。我希望紫色文本区域是这个宽度(没有指定宽度或百分比),即使文本长度很短。

无论我做什么来尝试让这个工作,我都会遇到约束冲突,日志对我来说不是很清楚。

collectionView.heightAnchor.constraint(equalToConstant: 150)

这是我目前看到的一个例子