ios - 在 UITableView 中使用动态标签宽度管理自动标题高度

Question

我想创建一个具有动态高度的 UITableView header 。我在 View 中有四个标签，标题的高度必须根据每个 UILabel 中的内容进行调整。我想实现类似于这张图片的东西。 Sample image.

这里标签的宽度会根据屏幕尺寸动态变化。 “类型”标签将覆盖大约 2/3 的屏幕，其余部分将平均分配给三个标签。这里根据屏幕尺寸，标签可以是多行的，我想根据标签的内容管理主视图的高度。

当我为标签提供固定宽度约束时，我能够成功地管理高度，但我想保持标签的宽度动态。这是一个 UITableView 标题。任何帮助将不胜感激。

Answer 1

像 tableViewCell 一样为标题和设计制作一个 customCell。

设计是如何完成的:

SMS EMAIL 和 PUSH NOTIFICATION 被封装到一个 stackView 中，它已经自动布局了 TYPE 标签。

这是层次结构。

这是Type(2/3)的布局设计，自己计算准确。

这是用于 stackView 的。

两者都是带有 superView 的自动布局(即单元格)

堆栈 View :

和 TYPE 标签。

将此单元格作为 tableView 的 headerView 插入。

怎么做？

在 viewDidLoad 中:

tableView.register(UINib.init(nibName: String(describing: TableHeader.self), bundle: nil), forCellReuseIdentifier: "headerCell")

在你各自的 View Controller 中添加这两个函数。

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let cell = tableView.dequeueReusableCell(withIdentifier: "headerCell") as! TableHeader
    return cell
}

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

这是输出:

对于 iOS 8:

StackView 不存在，所以我们需要使用 UIView 来代替。由于自动布局的解释很棘手，所以我只是分享了我的项目，这更容易理解。你可以从 here 查看

不使用 StackView 的输出如下:

获得了 2 次观看。颜色是为了更好地理解。