学会UITableView的适配技巧，iOS开发得心应手！

2023-10-14 13:16:14

iOS 中的 UITableView 适配技巧

掌握这些技巧，让你的 App 在不同设备和系统版本上闪耀

作为一名 iOS 开发者，你一定对 UITableView 控件再熟悉不过了。它可是表格视图控件中的扛把子，被广泛用于各种 App 中。但是，如果你想让你的 App 在不同设备和系统版本上都能完美运行，那 UITableView 的适配技巧就必须 get 起来！

规范使用 UITableViewHeaderFooterView

iOS 16 中，UITableViewHeaderFooterView 的处理方式发生了变化。为了避免适配问题，务必按照规范使用该控件，避免在 iOS 16 上出现错位或显示不正确的情况。

let headerView = UITableViewHeaderFooterView()
headerView.textLabel?.text = "Section Header"
headerView.textLabel?.font = UIFont.systemFont(ofSize: 16, weight: .bold)

灵活设置约束

灵活设置约束是保证 UITableView 在不同屏幕尺寸下都能正确显示的关键。例如，在横屏模式下，你可能需要调整列宽和行高，以适应更宽的屏幕。

tableView.rowHeight = UITableView.automaticDimension
tableView.estimatedRowHeight = 44

正确处理 cellForRowAtIndexPath 方法

cellForRowAtIndexPath 方法是 UITableView 中非常重要的一个方法，它负责创建和返回给定索引路径的单元格。为了保证在不同设备和系统版本上都能正确显示单元格，需要在该方法中正确处理约束、布局和数据绑定。

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CellIdentifier", for: indexPath)
    cell.textLabel?.text = "Cell \(indexPath.row)"
    return cell
}

使用 estimatedRowHeight 和 estimatedSectionHeaderHeight 属性

这两个属性可以帮助 UITableView 估算单元格和表头视图的高度，从而优化滚动性能。在实际开发中，适当调整这两个属性的值，可以有效减少 UITableView 的滚动卡顿。

tableView.estimatedRowHeight = 44
tableView.estimatedSectionHeaderHeight = 20

利用 UITableViewAutomaticDimension 属性

UITableViewAutomaticDimension 属性允许 UITableView 根据内容自动调整行高。这种特性可以大大简化开发人员的工作，让他们无需手动指定行高，即可获得最佳的显示效果。

tableView.rowHeight = UITableView.automaticDimension

关注 iOS 16 的新特性

iOS 16 中，UITableView 引入了了一些新特性，例如 Section Header 的悬浮效果和表头视图的索引化。这些新特性可以为 App 带来越丰富的交互体验，但需要注意的是，在使用这些新特性时，需要特别关注兼容性问题。

tableView.sectionHeaderTopPadding = 0
tableView.indexDisplayMode = .always

使用 Auto Layout

Auto Layout 是一种强大的布局系统，它可以帮助你轻松创建响应式布局，从而让你的 App 在不同设备和系统版本上都能完美显示。

let cell = UITableViewCell()
cell.translatesAutoresizingMaskIntoConstraints = false
cell.textLabel?.translatesAutoresizingMaskIntoConstraints = false
cell.contentView.addSubview(cell.textLabel!)
NSLayoutConstraint.activate([
    cell.textLabel!.leadingAnchor.constraint(equalTo: cell.contentView.leadingAnchor, constant: 16),
    cell.textLabel!.trailingAnchor.constraint(equalTo: cell.contentView.trailingAnchor, constant: -16),
    cell.textLabel!.topAnchor.constraint(equalTo: cell.contentView.topAnchor, constant: 8),
    cell.textLabel!.bottomAnchor.constraint(equalTo: cell.contentView.bottomAnchor, constant: -8)
])

使用 Size Classes

Size Classes 是一种非常方便的工具，它可以让你轻松为不同设备和屏幕尺寸创建不同的布局。

override func viewDidLoad() {
    super.viewDidLoad()

    if traitCollection.horizontalSizeClass == .compact && traitCollection.verticalSizeClass == .regular {
        // iPhone 竖屏布局
    } else if traitCollection.horizontalSizeClass == .regular && traitCollection.verticalSizeClass == .compact {
        // iPhone 横屏布局
    } else if traitCollection.horizontalSizeClass == .regular && traitCollection.verticalSizeClass == .regular {
        // iPad 竖屏布局
    } else if traitCollection.horizontalSizeClass == .compact && traitCollection.verticalSizeClass == .compact {
        // Apple Watch 布局
    }
}