当其他元素太宽时，在水平 UIStackview 中看不到标签

Posted 2023-03-13

【中文标题】当其他元素太宽时，在水平 UIStackview 中看不到标签

【英文标题】：Label doesn't seen in horizontal UIStackview when other elements are too wide

【发布时间】：2019-11-21 06:25:29

【问题描述】：

我有一个水平的 UIStackView。其中有以下元素；

UILabel - UILabel (lets call it second label)

第二个标签有一个adjustsFontSizeToFitWidth = true 属性和一个最小比例因子。当它有这么长的文本时，它会缩小到某个最小尺寸。第一个标签有一个firstLabel.setContentCompressionResistancePriority(.init(rawValue: 749), for: .horizontal) 属性来抵抗第二个标签。在这种情况下一切正常。

这个 UIStackView 正在以编程方式创建，有时它会再获得三个元素

UILabel - UIImageView - UIView(dummy) - UIImageView - UILabel

UIImageViews 有一个 12 常量点的特定 widthAnchor。 问题是： 在这种情况下labelWithInfoAndDownArrow，如果第一个 UILabel 有一个长文本，第二个 UILabel 不会显示在屏幕上。我该如何解决？

  override init(frame: CGRect) 
    super.init(frame: frame)

    self.translatesAutoresizingMaskIntoConstraints = false

    firstLabel.numberOfLines = 1
    firstLabel.font = UIFont.init(name: "Metropolis-Regular", size: 12)
    firstLabel.setContentCompressionResistancePriority(.init(rawValue: 249), for: .horizontal)
    secondLabel.numberOfLines = 1
    secondLabel.textAlignment = .right
    secondLabel.font = UIFont.init(name: "Metropolis-ExtraBold", size: 14)

    secondLabel.adjustsFontSizeToFitWidth = true
    secondLabel.minimumScaleFactor = 10/14

    horizontalStackView.addArrangedSubview(firstLabel)
    horizontalStackView.addArrangedSubview(secondLabel)

    iconImageView.widthAnchor.constraint(equalToConstant: 12).isActive = true
    infoImageView.widthAnchor.constraint(equalToConstant: 15).isActive = true

    addSubview(horizontalStackView)
    horizontalStackView.topAnchor.constraint(equalTo: topAnchor).isActive = true
    horizontalStackView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
    horizontalStackView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true
    horizontalStackView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true



convenience init(firstLabelText: String, secondLabelText: String) 
    self.init()
    firstLabel.text = firstLabelText
    secondLabel.text = secondLabelText
    accessibilityIdentifier = firstLabelText


convenience init(firstLabelText: String, secondLabelText: String,labelType: LabelType) 
    self.init(firstLabelText: firstLabelText, secondLabelText: secondLabelText)
    self.labelType = labelType

    switch labelType 
    case .labelWithInfoAndDownArrow:
        iconImageView.image = UIImage(named: "droparrow-down-icon-grey")
        horizontalStackView.insertArrangedSubview(infoImageView, at: 1)
        horizontalStackView.insertArrangedSubview(UIView(), at: 2)
        horizontalStackView.insertArrangedSubview(iconImageView, at: 4)
        let tap = UITapGestureRecognizer(target: self, action: #selector(self.handleInfoButtonTap(_:)))
        infoImageView.isUserInteractionEnabled = true
        infoImageView.addGestureRecognizer(tap)
        infoImageView.accessibilityIdentifier = firstLabelText
        if #available(ios 11.0, *) 
            horizontalStackView.setCustomSpacing(0, after: iconImageView)
            horizontalStackView.setCustomSpacing(0, after: firstLabel)
         else 
            // Fallback on earlier versions
            horizontalStackView.spacing = 0.0
        
    case .defaultLabel:
        break
    

编辑如果我将第一个标签压缩优先级设为 749。第二种情况已解决，但它打破了第一种情况，即第二个标签在不适合屏幕时字体变小。

【参考方案1】：

您可以尝试添加：

        firstLabel.widthAnchor.constraint(greaterThanOrEqualToConstant: 120).isActive = true
        secondLabel.widthAnchor.constraint(greaterThanOrEqualToConstant: 120).isActive = true

将 120 替换为您想要的 firstLabel 和 secondLabel 的最小尺寸。

您可以将其与您的

结合使用

        firstLabel.setContentCompressionResistancePriority(.init(rawValue: 249), for: .horizontal)        

或者没有它，取决于您期望的结果......

让我知道这是怎么回事：D