Swift基于单选按钮选择使用XIB与UIStackView切换视图时如何隐藏UI不留空白

残留空白的核心成因 #

遇到隐藏视图后空隙消不掉的问题，基本都是三类常见操作导致的：

• 没有把同组展示的内容打包成独立容器，直接把零散的标签、输入框、按钮塞到外层StackView里。只隐藏单个控件时，其余同组控件的约束位置没有联动调整，自然和下方元素拉开大段间隙
• 给作为StackView子视图的容器加了固定高度约束，哪怕视图被隐藏，StackView布局计算时还是会按之前的固定高度预留位置
• 嵌套StackView的配置不对，内层Stack没有跟随内容自适应尺寸，空占了布局空间

具体实现步骤 #

1. 重构XIB内的视图层级
   把视图A覆盖的所有标签、输入框、按钮，全部归到同一个自定义容器视图里；把视图B的所有元素归到另一个独立容器视图里。给两个容器视图加约束，让容器的上下边缘完全贴合内部最上、最下的子控件，不要给容器加任何固定高度/宽度的强制约束，确保容器本身没有冗余尺寸。
   完成层级整理后，把这两个容器作为arranged subview 放到外层的竖向UIStackView中。
2. 单选按钮的联动逻辑
   单选按钮值变化时，直接修改对应容器的隐藏状态即可：

   // 选中视图A对应的单选选项时
   containerA.isHidden = false
   containerB.isHidden = true
   
   // 选中视图B对应的单选选项时
   containerA.isHidden = true
   containerB.isHidden = false
   

   UIStackView默认会自动收拢被隐藏arranged subview占据的布局空间，自动调整上下相邻元素的位置，不会残留多余空隙。
3. StackView参数校准
   把外层StackView的参数调整为适配的配置：
   • axis 设置为竖向
   • distribution 设置为 fill
   • alignment 设置为 fill
     不要使用 equalSpacing、equalCentering 这类自动均分空间的分布模式——这类模式会在存在隐藏视图时强行把剩余高度平均分配，导致布局错位出现空白。

常见避坑点 #

• 不要用修改视图透明度alpha = 0的方式隐藏视图，这种方式下视图依然占据全部布局空间，StackView不会自动收拢位置
• 不要只隐藏视图内部的单个控件，不联动隐藏整个容器：比如只把视图A里的输入框藏了，但承载它的容器还是按原来的高度显示，自然会和下方元素拉开空白
• 如果设置完隐藏还是有间隙，逐一排查：是不是容器上有遗留的固定高度约束、StackView的间距设置和内部控件的边距叠加重合、嵌套Stack的translatesAutoresizingMaskIntoConstraints有没有正确关闭。

内容的提问来源于stack exchange，提问作者IskandarH