Swift - UIStackView - 如果所有项目的高度低于阈值，则隐藏答案

【问题标题】：Swift - UIStackView - hide if height of all items is below thresholdSwift - UIStackView - 如果所有项目的高度低于阈值，则隐藏
【发布时间】：2021-09-13 14:29:41
【问题描述】：

我有UIStackView 以垂直模式填充UIButtons。我有动态屏幕调整大小，如果堆栈视图中的所有按钮的高度都低于某个阈值，我想隐藏它们。如何自动实现？

我已尝试扩展UIButton 并添加：

override func layoutSubviews() {
    super.layoutSubviews()
    self.isHidden = (self.frame.height < 20)
}

这可行，但是一旦按钮被隐藏，它将永远不会重新出现，并且永远不会回调layoutSubviews（即使高度应该再次更大）。

【问题讨论】：

您的堆栈视图是否设置为distribution = .fillEqually，所以所有按钮的高度都相同？您需要设置.isHidden，还是设置.alpha = 0.0 / .alpha = 1.0 是一个合适的选项？（带有.alpha = 0.0 的按钮不接受触摸。）
@DonMag 是的，所有按钮的高度都相同。将alpha 设置为零是有问题的，因为按钮是透明的，基于一些其他信息，当它们再次“出现”时必须重新创建这些信息。但是，如果它是唯一的选择，它是可以做到的。

标签： uibutton uistackview layoutsubviews

【解决方案1】：

不清楚你在做什么，或者为什么你说设置按钮的.alpha属性会有问题，但这里有两种方法，都使用UIStackView子类和处理显示/隐藏layoutSubviews().

1：计算按钮高度将是多少并设置.isHidden属性：

class MyStackView: UIStackView {
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }
    required init(coder: NSCoder) {
        super.init(coder: coder)
        commonInit()
    }
    func commonInit() -> Void {
        axis = .vertical
        distribution = .fillEqually
        spacing = 8
    }
    override func layoutSubviews() {
        super.layoutSubviews()

        // approach 1
        //  setting .isHidden
        let numViews = arrangedSubviews.count
        let numSpaces = numViews - 1
        let h = (bounds.height - (spacing * CGFloat(numSpaces))) / CGFloat(numViews)
        let bHide = h < 20
        arrangedSubviews.forEach { v in
            v.isHidden = bHide
        }
        
    }
    
}

根据按钮高度设置.isHidden属性（简单得多）：

类 MyStackView: UIStackView {

 override init(frame: CGRect) {
     super.init(frame: frame)
     commonInit()
 }
 required init(coder: NSCoder) {
     super.init(coder: coder)
     commonInit()
 }
 func commonInit() -> Void {
     axis = .vertical
     distribution = .fillEqually
     spacing = 8
 }
 override func layoutSubviews() {
     super.layoutSubviews()

     // approach 2
     //  setting .alpha
     arrangedSubviews.forEach { v in
         v.alpha = v.frame.height < 20 ? 0.0 : 1.0
     }

 }

}

这里有一个示例控制器，可以查看它的使用情况。点击任意位置将在300 和100 之间切换堆栈视图的高度（按钮在100 处的高度将小于20 点）：

class ConditionalStackViewController: UIViewController {
    
    let stackView: MyStackView = {
        let v = MyStackView()
        // so we can see the stack view frame
        v.backgroundColor = .systemYellow
        v.translatesAutoresizingMaskIntoConstraints = false
        return v
    }()
    
    var stackHeight: NSLayoutConstraint!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        for i in 1...6 {
            let b = UIButton()
            b.setTitle("Button \(i)", for: [])
            b.setTitleColor(.white, for: .normal)
            b.setTitleColor(.lightGray, for: .highlighted)
            b.backgroundColor = .red
            stackView.addArrangedSubview(b)
        }
        
        view.addSubview(stackView)
        
        let g = view.safeAreaLayoutGuide
        
        stackHeight = stackView.heightAnchor.constraint(equalToConstant: 300.0)
        
        NSLayoutConstraint.activate([
            stackView.topAnchor.constraint(equalTo: g.topAnchor, constant: 20.0),
            stackView.leadingAnchor.constraint(equalTo: g.leadingAnchor, constant: 20.0),
            stackView.trailingAnchor.constraint(equalTo: g.trailingAnchor, constant: -20.0),
            stackHeight,
        ])
        
        let t = UITapGestureRecognizer(target: self, action: #selector(gotTap(_:)))
        view.addGestureRecognizer(t)
    }
    
    @objc func gotTap(_ g: UITapGestureRecognizer) -> Void {
        stackHeight.constant = stackHeight.constant == 300 ? 100 : 300
    }

}

【讨论】：