Question

我试图在左侧创建一个包含产品图像的单元格的表格视图，并在图像右侧显示各种产品详细信息（如价格，标题等）的列表，但是，我一直遇到问题在单元格之间设置适当的间距/填充。我希望每个单元格之间都有一些空白区域。这是一张显示我目前所拥有的图像，以及问题所在。

TableView

我使用stackview作为带有产品详细信息的标签的容器，并且我正在实现动态行高功能： self.tableView.rowHeight = UITableViewAutomaticDimension

除非看到stackview高度小于imageview高度，否则一切似乎都很有效。在这种情况下，我无法显示间距。在过去的两天里，我已经尝试了一切，这让我发疯了。在我这些人身上轻松一下，因为我是一个Android人：）

我想要的只是因为我希望tableview单元格的分隔符在imageview的顶部和底部或stackview之间有一点空间（以较高者/更高者为准）。 < / p>

我附上了故事板的SS来显示布局和约束。如果需要更多信息，请告诉我。

Storyboard

Answer 1

为您的单元格添加合适的间距更好的方法是将每个项目视为一个部分，因为您可以通过在部分之间创建标题视图来轻松地在各个部分之间设置间距。所以从逻辑上说，如果你有10个对象，那么 10个部分 每个部分只有一行。

1.每个部分只有一行

STREET

2. section的数量等于count项数组

 func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

3.设置Hieght以获得间距/标题视图

func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        return array.count 
    }

4.创建标题视图并自定义

 func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 10 
    }

Answer 2

假设您为每个单元格设置适当的高度没有问题（如果有，您可能需要检查此Q&A），我建议让每个单元格放在一个部分而不是将它们添加到同一个单元格中之一。

<强>技术：

默认情况下，如果您未实施numberOfSections(in:)，则会返回1。你应该：

实现它并让它返回数组数据源的数量 - 例如 - （而不是在tableView(_:numberOfRowsInSection:)中执行）。
让tableView(_:numberOfRowsInSection:)返回1。每个部分只有一个单元格。
之后，诀窍是为具有所需高度的部分（具有清晰的背景颜色）添加标题视图，高度将是该部分之间的边距（在您的情况下为单元格）。您应该通过实施：

tableView(:viewForHeaderInSection:) 和tableView( :heightForHeaderInSection:)。

代码类似于：

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
    // ...

    // MARK:- UITableViewDataSource
    func numberOfSections(in tableView: UITableView) -> Int {
        return dataSource.count
    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell-ID")

        // note that you should read from 'indexPath.section' instead of 'indexPath.row'
        let currentObejct = dataSource[indexPath.section]
    }

    // MARK:- UITableViewDelegate
    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        // here, you can customize the header
        // or your case want to let it clear...
        let margin = UIView(frame: CGRect(x: 0, y: 0, width: tableView.frame.size.width, height: 20.0))
        margin.backgroundColor = UIColor.clear

        return margin
    }

    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 20.0
    }

    // ...
}

希望这会有所帮助。

Answer 3

你可以尝试给Fruit Image一个顶部和一个底部约束，但它们必须是＆gt; =所以它不会弄乱你的自动布局

你的约束可能看起来像这样

Answer 4

3天后，我终于找到了一个我满意的解决方案，尽管它很笨拙，但在这一点上（处理这个问题3天），我真的不在乎。我发布了我的解决方案，以防将来帮助任何人。

我最终将视图固定到tableviewcell，最小高度为130，以包含imageview和stackview。因为我知道tableviewcells的最小高度是120,130在顶部和底部给出了5的填充。我附上了故事板的截图：

Storyboard TableView

无法添加一致的高度和填充。在动态tableview单元格之间

4 个答案: