内容拥抱优先级不适用于 UIStackView 中的自定义视图和 label

Question

I am having trouble getting content hugging working on a custom view. I have the following code:

pillView.setContentHuggingPriority(.required, for: .horizontal)
pillView.setContentCompressionResistancePriority(.required, for: .horizontal)
dateLabel.setContentHuggingPriority(.defaultLow, for: .horizontal)
dateLabel.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)

I add these two views to a stack view:

let dateStackView = UIStackView(arrangedSubviews: [pillView, dateLabel])

The result is like so:

The LIVE NOW view should hug it's content. It's defined like so:

final class PillView: UIView {

    private enum Constants {
        static let radius: CGFloat = 4.0
        static let labelInsets = UIEdgeInsets(horizontal: 8.0, vertical: 4.0)
    }

    enum Config {
        case attention

        var font: UIFont {
            switch self {
            case .attention: return Font.caption
            }
        }
        var textColor: UIColor {
            switch self {
            case .attention: return .white
            }
        }
        var backgroundColor: UIColor {
            switch self {
            case .attention: return Theme.red100
            }
        }
    }

    // MARK: - Properties

    private let config: Config

    // MARK: - Initializers

    init(text: String, config: Config = .attention) {
        self.config = config
        super.init(frame: .zero)

        backgroundColor = config.backgroundColor
        clipsToBounds = true
        layer.cornerRadius = Constants.radius

        let label = UILabel()
        label.font = config.font
        label.textColor = config.textColor
        label.text = text

        addSubview(label)
        label.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
          label.topAnchor.constraint(equalTo: topAnchor, constant: Constants.labelInsets.top),
          label.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -Constants.labelInsets.bottom),
          label.leadingAnchor.constraint(equalTo: leadingAnchor, constant: Constants.labelInsets.left),
          label.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -Constants.labelInsets.right)
        ])
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

}

Not sure why it won't hug the content when in a stack view. Any ideas? Would really appreciate some pointers on this. thanks!

Answer 1

Add these lines in your PillView init(...) func:

label.setContentHuggingPriority(.required, for: .horizontal)
label.setContentCompressionResistancePriority(.required, for: .horizontal)

You then don't need to set either of those properties for your pillView or dateLabel instances.

Answer 2

Check the distribution property for stackview. It should not be fillEqually as it will ignore the other view's configuration. Mark its value to fill

EDIT:

FillProportionally get me result as: