Swift开发:UITabBar上方出现的额外未知行是什么?
问题描述
我通过代码在ViewController中创建并添加了UITableView,之后界面出现了一行额外内容。我希望能对它进行控制,但首先需要明确它的归属。从表现来看,这行内容似乎来自UITabBar而非UITableView。请问这是什么对象?我尝试添加或移除UITableView的footer,但没有任何效果。
界面效果说明:UITableView底部出现一行与TabBar样式相似的额外区域,位于列表最后一项下方。
相关代码
import UIKit final class SearchViewController2: UIViewController, UITableViewDataSource, UITableViewDelegate { private let ingredients = [ "flour", "sugar", "eggs", "butter", "baking powder", "vanilla extract", "milk", "salt", "cocoa powder", "yeast", "olive oil", "cheese", "breadcrumbs", "onions", "garlic", "tomatoes", "basil", "oregano", "thyme", "parsley", "pepper" ] private let tableView: UITableView = { let tableView = UITableView() tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell") return tableView }() func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) let ingredient = ingredients[indexPath.row] var cellConfig = cell.defaultContentConfiguration() cellConfig.text = ingredient cell.contentConfiguration = cellConfig return cell } func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { ingredients.count } override func viewDidLoad() { super.viewDidLoad() let header = StretchyTableHeaderView( frame: CGRect( x: 0, y: 0, width: view.frame.size.width, height: view.frame.size.width / 2 ) ) view.addSubview(tableView) header.imageView.image = UIImage(named: "header") tableView.dataSource = self tableView.delegate = self tableView.frame = view.bounds tableView.tableHeaderView = header } } extension SearchViewController2: UIScrollViewDelegate { func scrollViewDidScroll(_ scrollView: UIScrollView) { guard let header = tableView.tableHeaderView as? StretchyTableHeaderView else { return } header.scrollViewDidScroll(scrollView: tableView) } }
解答
这个额外区域既不是UITabBar的一部分,也不是UITableView的footer,而是系统为避免TabBar遮挡TableView内容自动添加的底部contentInset空间。当你的ViewController被嵌入到UITabBarController中时,iOS会自动给TableView设置等于TabBar高度的底部内边距,若TableView内容长度不足以填满屏幕,就会在最后一行下方显示出这个内边距对应的空白区域,视觉上类似TabBar的延伸。
你之前调整tableFooterView没用,是因为这个区域和footer无关,属于滚动视图的内边距设置。要控制或消除这个区域,可以用以下几种方法:
- 手动设置TableView的内边距:
如果需要保留内边距或自定义高度,可手动设置:
if let tabBarHeight = tabBarController?.tabBar.frame.height { tableView.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: tabBarHeight, right: 0) tableView.scrollIndicatorInsets = tableView.contentInset }
若不需要这个空白,直接将bottom值设为0即可。
- 使用AutoLayout约束(推荐):
放弃直接设置frame的方式,用约束让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) ])
当ViewController在TabBarController中时,view的bottomAnchor会自动避开TabBar,TableView不会出现多余的底部空白。
内容的提问来源于stack exchange,提问作者Thomas H.
相关产品推荐
相关产品推荐

