带有图像和文本字段的自动布局表格单元格？

Posted 2023-02-27

【中文标题】带有图像和文本字段的自动布局表格单元格？

【英文标题】：Autolayout table cell with image and text fields?

【发布时间】：2015-05-11 22:34:04

【问题描述】：

我正在寻找一个带有照片的表格视图单元格，并使用自动布局包装文本。我已经用自动布局管理了很多，但我不知道如何做到这一点。

┌─────────────────────────────────────────────────────┐
│ ┌──────────┐ ┌────────────────────────────────────┐ │
│ │          │ │ Title (might wrap)                 │ │
│ │          │ └────────────────────────────────────┘ │
│ │  Photo   │ ┌────────────────────────────────────┐ │
│ │          │ │ Body text. May wrap, may contain   │ │
│ │          │ │ multiple lines.                    │ │
│ │          │ └────────────────────────────────────┘ │
│ └──────────┘                                        │
└─────────────────────────────────────────────────────┘

随着文本的展开，我想将照片保留在左上角并展开单元格。但是，单元格不应缩小到显示照片所需的最小值（带边距）。

┌─────────────────────────────────────────────────────┐
│ ┌──────────┐ ┌────────────────────────────────────┐ │
│ │          │ │ Title (might wrap)                 │ │
│ │          │ │ Maybe even to two lines.           │ │
│ │  Photo   │ └────────────────────────────────────┘ │
│ │          │ ┌────────────────────────────────────┐ │
│ │          │ │ Body text. May wrap, may contain   │ │
│ │          │ │ multiple lines.                    │ │
│ └──────────┘ │                                    │ │
│              │ Text could require more vertical   │ │
│              │ space than the photo.              │ │
│              └────────────────────────────────────┘ │
└─────────────────────────────────────────────────────┘

我需要 ios 8 或更高版本。

我尝试仅使用列出的三个视图来执行此操作，并将左侧项目和右侧项目放在两个视图中。我尝试的每个组合似乎都忽略了照片的最小尺寸。

（顺便说一句，对于任何好奇的人：通过 Monodraw 绘制图形。）

【问题讨论】：

你确定 TableView 的 rowHeight 是UITableViewAutomaticDimension。您是否将estimatedRowHeight 设置为大于平均图像视图高度？

支持 ASCII 艺术 ;)

是否有人愿意为此解决方案发布代码或项目？我有一个类似的布局并且它大部分都在工作，除了我不能让标题完全换行......它似乎在任意数量的字符之后被一个椭圆切断。 “Lines”为 0，“Line Break”为“Word Wrap”。

【参考方案1】：

尝试建立以下关系：

照片：

宽度 = X 高度 = Y 左 = 单元格 + Z 顶部 = 单元格 + Z

标题：

左 = 照片 + Z 右 = 单元格 - Z 顶部 = 单元格 + Z

标签会根据内容自动计算高度

正文：

左 = 标题 右 = 标题 Top = Title.Bottom + Z

单元格：（这是重要的部分）

底部 >=（等于或大于）Body.Bottom + Z 底部 >= 照片.底部 + Z

这将强制单元格始终高于图像 + 偏移量或高于标签 + 偏移量

【讨论】：

我已经尝试过了，但照片没有将单元格保持在最小尺寸。我会在一小时内上传一个要点。

没关系，你是对的。我不知何故有一个 extra 约束在那里弄脏了它。我的感谢。这让我发疯了；看起来很简单！

我发现的唯一另一件事是，对于任何将来阅读本文的人来说，tableView:estimatedHeightForRowAtIndexPath: 必须存在才能使其工作，尽管返回 UITableViewAutomaticDimension 很好。 （我使用此视图控制器的目标之一将其排除在外。）