UIScrollView使用SnapKit配置AutoLayout时底部元素不显示无法滚动问题咨询

问题排查结果 #

你的代码里存在3处明显的约束错误，是导致滚动异常、底部内容显示不全的直接原因：

• *contentView约束配置错误：UIScrollView的自动布局依赖contentView的边界约束计算contentSize，你当前把contentView的高度和scrollView的高度做了绑定，导致contentSize高度永远等于scrollView的可视高度，内容超出时既无法滚动，底部内容也会被截断。
• *accountsView顶部约束绑定错误：accountsView作为contentView的子视图，你把它的top约束绑定到了控制器view的safeArea顶部，而非contentView的顶部，会导致子视图坐标计算偏差，内容位置异常。
• *contentView缺少底部闭合约束：你注释了cancelButton和contentView底部的绑定约束，系统无法计算出contentView的实际高度，scrollView的contentSize无法正确生成。

修复方案 #

1. 修正scrollView和contentView的约束 #

scrollView.snp.makeConstraints { (make) in
    make.top.equalTo(self.view.safeAreaLayoutGuide.snp.top)
    make.leading.trailing.equalTo(0)
    make.bottom.equalTo(self.view.bottom)
}

let contentView = UIView(frame: .zero)
scrollView.addSubview(contentView)
contentView.snp.makeConstraints { (make) in
    // 绑定contentLayoutGuide确定contentSize边界
    make.edges.equalTo(scrollView.contentLayoutGuide)
    // 宽度绑定frameLayoutGuide，避免横向滚动
    make.width.equalTo(scrollView.frameLayoutGuide)
}

2. 修正accountsView的顶部约束 #

accountsView.snp.makeConstraints { (make) in
    make.leading.trailing.equalTo(0)
    // 绑定contentView的顶部
    make.top.equalTo(contentView.snp.top)
}

3. 打开cancelButton的底部约束，闭合contentView边界 #

cancelButton.snp.makeConstraints { (make) in
    make.leading.equalTo(20)
    make.trailing.equalTo(-20)
    make.height.equalTo(44)
    make.top.equalTo(disconnectButton.snp.bottom).offset(16)
    // 取消注释，闭合contentView底部边界
    make.bottom.equalTo(contentView.snp.bottom).offset(-16)
}

如果需要适配底部安全区，可将最后一行修改为：

make.bottom.equalTo(contentView.snp.bottom).offset(-16 - bottomSafeOffset)

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