UITableViewAutomaticDimension下TextView与ImageView动态单元格尺寸适配问题

嘿，我之前做项目的时候刚好踩过这个坑，咱们来一步步捋清楚问题出在哪，以及怎么用约束搞定它～

你可能犯的几个常见错误 #

从你的描述来看，核心问题出在约束没有建立正确的依赖关系，导致Auto Layout只计算了TextView的高度，却没把ImageView的位置变化纳入布局计算：

• 你的ImageView大概率是直接和cell的contentView底部绑定了固定约束，但顶部没有和TextView的底部关联——TextView变长时，ImageView还停留在原来固定cell高度的位置，没被“带动”。
• 可能你给ImageView设置了固定高度，却没让它和布局中的动态元素（比如TextView）联动，或者没设置自适应图片的约束。
• 还有一种可能是TextView的底部没有约束到任何元素，导致cell的自动高度只计算了TextView的部分，ImageView的位置完全脱离了布局链。

正确的约束设置方案 #

根据常见的两种布局场景，给你对应的约束配置：

场景1：TextView在上，ImageView在下（上下排列） #

这应该是你遇到的情况，按照以下步骤设置约束：

• TextView的约束：
  • 顶部 → contentView顶部（设置合适的间距，比如16）
  • 左侧 → contentView左侧（比如16）
  • 右侧 → contentView右侧（比如16）
  • 底部 → ImageView的顶部（设置间距，比如8）
  • 别忘了在Storyboard里把TextView的「Lines」设为0，代码里也要加textView.numberOfLines = 0，让它能自动换行扩展高度。
• ImageView的约束：
  • 左侧 → contentView左侧（比如16）
  • 右侧 → contentView右侧（比如16）
  • 底部 → contentView底部（比如16）
  • 高度设置：如果是固定尺寸的图片，直接设固定高度；如果要自适应图片内容，给ImageView加宽高比约束（比如图片是1:1，就设宽高比为1:1），同时把ImageView的contentMode设为scaleAspectFit或scaleAspectFill。

场景2：ImageView在左，TextView在右（左右排列） #

如果是这种横向布局，约束要这么配：

• ImageView的约束：
  • 顶部 → contentView顶部（比如16）
  • 左侧 → contentView左侧（比如16）
  • 底部 → contentView底部（比如16）
  • 宽度设固定值（比如40），或者加固定宽高比（比如1:1）。
• TextView的约束：
  • 顶部 → contentView顶部（比如16）
  • 左侧 → ImageView右侧（比如8）
  • 右侧 → contentView右侧（比如16）
  • 底部 → contentView底部（比如16）
  • 同样要把TextView的「Lines」设为0，开启自动换行。

额外的关键设置 #

除了约束，还要确保这两点：

1. TableView的自动高度配置：
   代码里要加：

   tableView.rowHeight = UITableView.automaticDimension
   tableView.estimatedRowHeight = 100 // 设一个合理的预估高度
   

   或者在Storyboard里选中TableView，在「Attributes Inspector」里把「Row Height」设为Automatic，「Estimated Row Height」设为100。
2. 关闭自动转译约束：
   确保ImageView和TextView的translatesAutoresizingMaskIntoConstraints都设为false（Storyboard里默认勾选「Use Auto Layout」的话就已经关闭了）。

核心逻辑就是：让ImageView的位置依赖于TextView的动态高度，同时让所有控件的约束形成从contentView顶部到底部的完整链条，这样Auto Layout就能正确计算出包含两个控件的cell总高度，ImageView也会跟着TextView的变化自动调整位置啦～

内容的提问来源于stack exchange，提问作者husharoonie