为启用分页的UIScrollView添加UITableView无显示问题排查

嘿，我帮你找出问题啦！咱们一步步来解决：

核心问题分析 #

你的代码里有两个关键问题导致UITableView不显示：

1. 复用同一个UITableView实例：你只创建了一个tableView对象，在循环中反复修改它的frame并添加到scrollView。但UIKit中一个视图只能属于一个父视图，所以最后只有最后一次添加的tableView会留在scrollView上，前面的都会被自动移除。
2. 视图层级被覆盖：你在添加tableView之后又添加了UILabel，UILabel会被放在tableView的上层，就算tableView能显示也会被完全盖住。

修复后的基础Frame版本 #

修改代码，每次循环创建新的UITableView实例，并且移除测试用的UILabel（或者调整添加顺序让tableView在上面）：

override func viewDidLoad() {
    super.viewDidLoad()
    let frameOfScrollView : CGRect = CGRect(x:0, y:0, width:screenWidth, height:screenHeight)
    scrollView.frame = frameOfScrollView
    scrollView.delegate = self
    scrollView.isPagingEnabled = true
    self.view.addSubview(scrollView)
    scrollView.contentSize = CGSize(width: scrollView.frame.size.width * 4, height: scrollView.frame.size.height)
    
    for index in 0..<4 {
        frame.origin.x = scrollView.frame.size.width * CGFloat(index)
        frame.size = scrollView.frame.size
        
        // 每次循环创建新的UITableView
        let tableView = UITableView(frame: frame)
        tableView.delegate = self
        tableView.dataSource = self
        tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
        // 加个半透明背景色方便区分页面
        tableView.backgroundColor = colors[index].withAlphaComponent(0.5)
        scrollView.addSubview(tableView)
        
        // 注释掉测试用的Label，避免覆盖tableView
        // let subView = UILabel(frame: frame)
        // subView.backgroundColor = colors[index]
        // subView.text = "how are you?"
        // scrollView.addSubview(subView)
    }
}

这样每个分页都会有独立的UITableView，就能正常显示列表内容了。

进阶：AutoLayout实现（推荐） #

纯Frame适配性差，推荐用AutoLayout来构建界面，不用手动计算contentSize，自动适配所有设备：

class SampleViewController: UIViewController, UIScrollViewDelegate, UITableViewDelegate, UITableViewDataSource {
    let colors:[UIColor] = [.red, .blue, .green, .yellow]
    let animals: [String] = ["Horse", "Cow", "Camel", "Sheep", "Goat", "Dog", "Cat", "Kitten", "Lion", "Tiger", "Owl", "Skylark", "Snail", "Cub", "Zebra"]
    let cellReuseIdentifier = "cell"
    
    // 懒加载或直接创建，关闭自动约束转换
    lazy var scrollView: UIScrollView = {
        let sv = UIScrollView()
        sv.delegate = self
        sv.isPagingEnabled = true
        sv.showsHorizontalScrollIndicator = false
        sv.translatesAutoresizingMaskIntoConstraints = false
        return sv
    }()
    
    lazy var pageControl: UIPageControl = {
        let pc = UIPageControl()
        pc.numberOfPages = 4
        pc.currentPage = 0
        pc.translatesAutoresizingMaskIntoConstraints = false
        return pc
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        setupViews()
        setupConstraints()
        addPageTableViews()
    }
    
    private func setupViews() {
        view.addSubview(scrollView)
        view.addSubview(pageControl)
    }
    
    private func setupConstraints() {
        NSLayoutConstraint.activate([
            // 把scrollView固定在屏幕边缘
            scrollView.topAnchor.constraint(equalTo: view.topAnchor),
            scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
            
            // PageControl放在底部安全区中间
            pageControl.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -20),
            pageControl.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            pageControl.widthAnchor.constraint(equalToConstant: 200),
            pageControl.heightAnchor.constraint(equalToConstant: 50)
        ])
    }
    
    private func addPageTableViews() {
        var previousTableView: UITableView?
        
        for index in 0..<4 {
            let tableView = UITableView()
            tableView.delegate = self
            tableView.dataSource = self
            tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
            tableView.backgroundColor = colors[index].withAlphaComponent(0.5)
            tableView.translatesAutoresizingMaskIntoConstraints = false
            scrollView.addSubview(tableView)
            
            NSLayoutConstraint.activate([
                // 每个tableView高度和scrollView一致
                tableView.topAnchor.constraint(equalTo: scrollView.topAnchor),
                tableView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
                tableView.heightAnchor.constraint(equalTo: scrollView.heightAnchor),
                // 宽度和屏幕一致
                tableView.widthAnchor.constraint(equalTo: view.widthAnchor),
                
                // 第一个tableView贴scrollView左边，后面的贴前一个tableView的右边
                tableView.leadingAnchor.constraint(equalTo: previousTableView?.trailingAnchor ?? scrollView.leadingAnchor)
            ])
            
            // 最后一个tableView贴scrollView右边，自动计算contentSize
            if index == 3 {
                tableView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
            }
            
            previousTableView = tableView
        }
    }
    
    // 代理方法保持不变
    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        let pageNumber = round(scrollView.contentOffset.x / scrollView.frame.size.width)
        pageControl.currentPage = Int(pageNumber)
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return animals.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier, for: indexPath)
        cell.textLabel?.text = animals[indexPath.row]
        return cell
    }
}

这个版本的优势是完全适配不同屏幕尺寸，不需要手动计算frame和contentSize，约束逻辑清晰。

替代方案：使用UICollectionView #

如果你的分页需求比较复杂，或者页面数量较多，也可以用UICollectionView实现分页：

1. 设置UICollectionViewFlowLayout的itemSize为屏幕大小，滚动方向设为水平，最小行间距为0
2. 开启UICollectionView的分页功能
3. 每个CollectionViewCell中嵌入一个UITableView

这种方式更适合动态管理页面的场景，复用性更强。

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