当标签的文本为零时，如何轻松折叠标签周围的垂直空间？

Posted 2023-02-25

【中文标题】当标签的文本为零时，如何轻松折叠标签周围的垂直空间？

【英文标题】：How to easily collapse vertical space around label when its text is nil?

【发布时间】：2015-09-11 13:46:00

【问题描述】：

假设我有三个标签，它们在一列中彼此下方排列。最上面的标签的顶部边缘固定到超级视图的顶部边缘。所有后续标签的顶部边缘都固定到前一个标签的底部边缘。所有标签的前缘和后缘都固定到超级视图的前缘和后缘。这是它在 Interface Builder 中的样子（我在每个标签上添加了蓝色背景以显示其范围）。

在模拟器中，结果如下所示。

所有标签都连接到视图控制器中的插座。

@IBOutlet weak var label1: UILabel!
@IBOutlet weak var label2: UILabel!
@IBOutlet weak var label3: UILabel!

当我将label2的文本设置为nil时

label2.text = nil

标签本身会折叠。

但是，标签周围的顶部和底部空间不会折叠。上一个屏幕截图的中间标签上没有蓝色背景，这一点就很明显了。因此，label1 和 label3 之间的空间是第一个屏幕截图中布局空间的两倍。

我的问题是 - 在 iOS8 上 - 折叠中间标签的顶部或底部空间以使剩余的两个标签仍使用原始布局中定义的垂直间距的最简单方法是什么？说清楚，这就是我想要达到的结果。

到目前为止我发现的选项：

底部/顶部间距约束出口

为中间标签的顶部或底部间距约束定义一个出口。

@IBOutlet weak var spacingConstraint: NSLayoutConstraint!

将约束的初始常量存储到变量中（例如在awakeFromNib 或viewDidLoad 中）。

private var initialSpacing: CGFloat!

override func viewDidLoad() 
    initialSpacing = spacingConstraint.constant
    ...

当文本设置为nil 时将约束的常量设置为零，或者当文本不是nil 时将其设置回初始值。

spacingConstraint.constant = label2.text == nil ? 0 : initialSpacing

这种方法感觉有点笨拙，因为它需要两个额外的变量。

高度约束出口

将中间标签周围的垂直间距设置为零，并将其高度增加相同的量。为高度约束定义一个出口并按照上述方法进行操作，当文本为nil 时将高度设置为零，当高度不是nil 时将其设置回初始值。

这仍然和以前的方法一样笨拙。此外，您必须对间距进行硬编码，并且不能使用内置的默认间距（界面生成器中的空白字段）。

UIStackView

这不是一个选项，因为UIStackView 仅适用于 ios 9 及更高版本。

【问题讨论】：

你有没有想过使用tableview？？我认为表格视图是为这种情况制作的:)

您可以禁用滚动。

@JasonNam 使用表格视图可能是一种解决方案。但是，有一定的开销（实现数据源方法）与之相关。

也许刷新了约束？在检查 label2 = nil;?

之后类似于[self.view layoutIfNeeded];

【参考方案1】：

我为此使用了this UIView 类别。

它扩展了UIView，使用objective-c 运行时框架添加了另外两个名为fd_collapsed 和fd_collapsibleConstraints 的属性。当fd_collapsed 属性设置为YES 时，您只需拖动要禁用的约束。在幕后，它捕获这些约束的初始值，然后在 fd_collapsed 为 YES 时设置为零。当fd_collapsed 为NO 时重置为初始值。

还有另一个属性叫做fd_autocollapsed

不是每个视图都需要添加宽度或高度约束，像 UILabel、UIImageView 这样的视图在它们有内容时都有它们的 Intrinsic 内容大小。对于这些视图，我们提供了 Auto collapse 属性，当其内容消失时，选定的约束将自动折叠。

只要指定视图有要显示的内容，此属性就会自动将fd_collapsed 属性设置为YES。

使用起来非常简单。没有这样的内置解决方案有点可惜。

【讨论】：

甜，看起来很有希望。

【参考方案2】：

您的解决方案对我来说已经足够好了，我会做底部/顶部间距约束出口解决方案，但因为您想要不同的东西。您可以使用这个第三方：https://github.com/orta/ORStackView 它支持 iOS7+ 并完全满足您的需求。

【讨论】：

谢谢，我会考虑的。

【参考方案3】：

这是所有完美主义开发者在尝试堆叠一堆标签时都知道的低调痛苦。解决方案可能会变得过于冗长、令人讨厌，而且实施起来确实很烦人（即，保持对***约束的引用......一旦你多次这样做就会很烦人，或者只是改变标签的顺序）

希望我下面的代码可以结束这种情况：

class MyLabel: UILabel 

    var topPadding: CGFloat = 0

    override func drawText(in rect: CGRect) 
        var newRect = rect
        newRect.origin.y += topPadding/2

        super.drawText(in: newRect)
    

    override var intrinsicContentSize: CGSize 
        var newIntrisicSize = super.intrinsicContentSize

        guard newIntrisicSize != .zero else 
            return .zero
        

        newIntrisicSize.height += topPadding
        return newIntrisicSize
    

用法：

let label = MyLabel()
label.topPadding = 10    
// then use autolayout to stack your labels with 0 offset

当然，它仅适用于顶部填充，但这应该是正确布局标签所需的唯一内容。无论有没有自动布局，它都可以很好地工作。这也是一个很大的优势，不需要做任何额外的心理体操来做这么简单的事情。享受吧！