iOS Swift：如何让ViewController中的UITableView滚动至屏幕顶部？

嘿，刚入门iOS开发的小伙伴别慌！你说的这种让UITableView能滚动到屏幕顶部、盖住上方UIView的设计，咱们业内一般叫头部视图随列表滚动收起，或者更直白点说就是「列表滚上去顶掉头部视图」。我给你俩简单好上手的实现思路，都是Swift里常用的：

方法一：把UIView设为TableView的tableHeaderView #

这是最省心的方案，系统已经帮咱们处理好了滚动逻辑：

• 先把你原来放在屏幕上半部分的UIView，从ViewController的根view上移除
• 给这个UIView设置好固定高度（比如屏幕高度的一半：UIScreen.main.bounds.height / 2），然后直接赋值给tableView的tableHeaderView属性
• 记得把TableView的顶部约束和ViewController的view顶部对齐，这样headerView才能正常显示在最上方

举个代码例子：

override func viewDidLoad() {
    super.viewDidLoad()
    
    // 假设你的头部视图叫topView，列表叫tableView
    topView.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height / 2)
    tableView.tableHeaderView = topView
    
    // 用AutoLayout约束TableView的全屏布局
    tableView.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        tableView.topAnchor.constraint(equalTo: view.topAnchor),
        tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
        tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
        tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
    ])
}

这样滚动TableView的时候，头部视图会跟着向上滑动，直到完全移出屏幕顶部，完美符合你的需求。

方法二：监听滚动偏移，手动调整UIView位置 #

如果需要更自定义的动画（比如头部慢慢缩小再消失），可以用UIScrollView的代理方法来手动控制：

• 让你的ViewController遵循UITableViewDelegate协议
• 记录头部视图的原始位置和高度，在滚动时根据偏移量调整它的frame（或AutoLayout约束）

代码示例：

class YourViewController: UIViewController, UITableViewDelegate {
    
    @IBOutlet weak var topView: UIView!
    @IBOutlet weak var tableView: UITableView!
    
    // 存下头部视图的初始状态
    private var originalTopY: CGFloat = 0
    private var originalTopHeight: CGFloat = 0
    
    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.delegate = self
        // 记录初始值
        originalTopY = topView.frame.origin.y
        originalTopHeight = topView.bounds.height
    }
    
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let offsetY = scrollView.contentOffset.y
        
        // 只处理向上滚动的情况
        if offsetY > 0 {
            // 计算新的Y坐标，避免过度偏移
            let newTopY = max(originalTopY - offsetY, -originalTopHeight)
            topView.frame.origin.y = newTopY
            
            // 如果需要同时缩小头部高度，取消下面的注释就行
            // let newHeight = max(originalTopHeight - offsetY, 0)
            // topView.frame.size.height = newHeight
        } else {
            // 向下滚动时恢复头部的初始位置
            topView.frame.origin.y = originalTopY
            // topView.frame.size.height = originalTopHeight
        }
    }
}

要是你用的是AutoLayout而不是frame布局，可以把topView的top约束做成IBOutlet，然后修改它的constant值来实现偏移效果。

小提醒 #

• 用方法一的时候，要是headerView里有复杂布局，记得给它添加正确的约束，避免滚动时出现布局错乱
• 方法二要注意处理边界情况，比如滚动偏移量超过头部高度时，别让视图出现奇怪的位置

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