如何在 Swift 中为 UITableView 设置左右边距

Posted 2023-02-27

【中文标题】如何在 Swift 中为 UITableView 设置左右边距

【英文标题】：How to set left and right margin for UITableView in Swift

【发布时间】：2020-12-16 13:42:30

【问题描述】：

我在控制器中使用 UITableView 来显示带有一些信息（标题、副标题和图像）的单元格。我想为 tableView 添加一些填充，但我找不到合适的解决方案。这是我的表格视图代码：

private let tableView: UITableView = 
    let tableView = UITableView(frame: .zero, style: .grouped)
    tableView.translatesAutoresizingMaskIntoConstraints = false
    tableView.backgroundColor = .clear
    tableView.separatorStyle = .none
    tableView.allowsSelection = false
    tableView.showsVerticalScrollIndicator = false
    tableView.estimatedRowHeight = 44.0
    tableView.rowHeight = UITableView.automaticDimension
    return tableView
()

在 viewDidLoad() 里面我为那个 tableView

设置了约束

NSLayoutConstraint.activate([
    tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    tableView.topAnchor.constraint(equalTo: view.topAnchor),
    tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

现在我的视图是这样的：

现在，当我尝试通过添加以下内容在 tableView 闭包中配置 contentInset 属性时：

tableView.contentInset = .init(top: 0, left: 23.5, bottom: 0, right: -23.5)

如您所见，它只在左侧添加了空间，但查看了 调试视图层次结构 我可以说它把 contentView 移到了右侧（它的宽度仍然与其父视图相同）

来自视图调试器的信息。 表格视图：

<UITableView: 0x7fba82016000; frame = (0 0; 390 844); clipsToBounds = YES; gestureRecognizers = <NSArray: 0x60000023de90>; layer = <CALayer: 0x600000c4b9e0>; contentOffset: -23.333333333333332, -47; contentSize: 390, 635.66666666666663; adjustedContentInset: 47, 23.5, 34, -23.5; dataSource: <Myapp.WelcomeViewController: 0x7fba81c08f60>>

和第一个单元格：

<UITableViewCellContentView: 0x7fba84021250; frame = (0 0; 390 87); gestureRecognizers = <NSArray: 0x6000002cf900>; layer = <CALayer: 0x600000c2b900>>

TableView 与单元格具有相同的宽度（390 对 390）。如何在 tableView 的左侧和右侧添加我的填充，而不对该 tableView 进行限制（我希望该区域也可以滚动）

【问题讨论】：

您是否尝试过将右插图更改为 23.5 而不是 -23.5？

@boa_in_samoa 我已经尝试过使用 tableView.contentInset = .init(top: 0, left: 23.5, bottom: 0, right: 23.5)，并且使用该配置会出现新问题。 TableView 也可以在垂直和水平方向上滚动，这是我不想要的，因为向右填充位于视图 +23.5 的后面。

@ShadeToD - 我不认为你会得到你想要的东西......它设置了 tableView 的scrollView inset。您可能需要设置单元格的.contentView.layoutMargins，对左右插入使用正值。

我把这个方法放在 cellForRowAt() 里面就可以了！

【参考方案1】：

您可以通过在单元格的contentView 上设置.layoutMargins 来做到这一点（在单元格类本身中或在cellForRowAt 中：

cell.contentView.layoutMargins = .init(top: 0.0, left: 23.5, bottom: 0.0, right: 23.5)

或在表格视图本身上：

override func viewDidLoad() 
    super.viewDidLoad()
    tableView.layoutMargins = .init(top: 0.0, left: 23.5, bottom: 0.0, right: 23.5)
    // if you want the separator lines to follow the content width
    tableView.separatorInset = tableView.layoutMargins

【讨论】：

这如我所愿！现在我的单元格有与设计相匹配的填充物。谢谢

【参考方案2】：

你可以试试这个：

在添加约束的同时添加常量

NSLayoutConstraint.activate([
tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20),
   tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 20),
tableView.topAnchor.constraint(equalTo: view.topAnchor),
tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

【讨论】：

正如我之前提到的，我想在不向约束添加常量的情况下执行此操作（我希望该区域也可以滚动）

好的，也可以通过向单元格内容添加填充来完成

【参考方案3】：

试试这个

override var frame: CGRect 
        get 
            return super.frame
        
        set (newFrame) 
            var frame = newFrame
            frame.origin.x += 10
            frame.size.width -= 2 * 10
            super.frame = frame
        
    

【讨论】：

我不认为在使用自动布局的同时玩帧是一个好的解决方案。