【问题标题】:Setting up different layouts for one cell, depending on its content为一个单元格设置不同的布局,具体取决于其内容
【发布时间】:2020-09-13 17:09:45
【问题描述】:

在 UITableViewCell 中,我有一个 UIView 容器,其中包含顶部的 UIImageView 和底部的 UILabel。当 UILabel 不包含文本时,我想删除 UILabel 并将 UImageView 调整到我的 UIView 容器的底部。

在我的 TableViewCell 中,我有这个:

        let x = imageViewPostPreview.bottomAnchor.constraint(equalTo: viewPreviewOverlay.topAnchor, constant: 0)

        if postText == "" {
            x.isActive = true
            imageViewPostPreview.layer.maskedCorners = [.layerMaxXMinYCorner, .layerMinXMinYCorner, .layerMaxXMaxYCorner, .layerMinXMaxYCorner]
            self.layoutSubviews()
            self.layoutIfNeeded()

        } else if postText != "" {
            x.isActive = false
            imageViewPostPreview.layer.maskedCorners = [.layerMaxXMinYCorner, .layerMinXMinYCorner]
            self.layoutSubviews()
            self.layoutIfNeeded()
            }
        }

这段代码在加载初始 UITableViewCell 时有效,但是当我滚动 UITableView 时,单元格会丢失初始布局。

如何正确设置布局,使布局保持滚动状态?

编辑:

初始单元格,正确:

滚动后,布局错误:

【问题讨论】:

  • 请分享您的 cellForRowAt 代码。并且不要使用屏幕截图的图片。很难阅读。

标签: swift uitableview layout


【解决方案1】:

将此添加到 prepareToReuse 方法

 override func prepareForReuse() {
    super.prepareForReuse()


  let x = imageViewPostPreview.bottomAnchor.constraint(equalTo: viewPreviewOverlay.topAnchor, constant: 0)

    if postText.isEmpty {
      x.isActive = true
      imageViewPostPreview.layer.maskedCorners = [.layerMaxXMinYCorner, .layerMinXMinYCorner, .layerMaxXMaxYCorner, .layerMinXMaxYCorner]


  } else  {
      x.isActive = false
      imageViewPostPreview.layer.maskedCorners = [.layerMaxXMinYCorner, .layerMinXMinYCorner]

      }

   self.layoutIfNeeded()
  }

注意:不要直接调用layoutSubview ...总是尝试调用layoutifNeeded或setNeedsLayout

【讨论】:

  • 嗨jawadAli,我有同样的效果..它的布局仍然不正确:(
  • 可以分享demo项目来测试一下吗?
【解决方案2】:

让单元格自动计算其大小的一种方法是在单元格视图内为垂直轴上的所有方向设置约束。因此,在您的情况下,图像视图的顶部、前导和尾随设置为超级视图,底部为标签。标签将具有前导和底部到超级视图,顶部将是您设置的图像视图。设置垂直轴很重要,因为对于表格视图,我们需要它来计算高度。这样表格视图就会知道会发生什么,并且可以自动设置高度。

然后你设置tableView.rowHeight = UITableView.automaticDimension。或者你也可以在委托方法中设置。

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return UITableView.automaticDimension }

完成所有这些后,您只需为单元格子视图(在这种情况下设置图像和文本)提供正确的值。您可以在单元格内执行此操作以获取行功能。示例代码如下所示。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "identifier", for: indexPath)
    let model = self.models[indexPath.row]
    cell.imageViewPostPreview.image = model.image ?? nil
    cell.postText.text = model.text ?? nil
    return cell
    }

这应该可以工作,无需进一步计算约束并调用布局进行更新。希望这可以帮助!您也可以查看question

【讨论】:

    猜你喜欢
    • 2020-07-31
    • 2016-02-12
    • 2020-01-24
    • 1970-01-01
    • 1970-01-01
    • 2012-07-18
    • 2019-01-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多