Auto Layout高度约束动画未达预期：视图扩高时背景异常看似Y轴平移

需求背景 #

开发者需要在ViewController中使用Layout Constraints实现视图动画效果，目标是将视图高度从0调整为设定的最终高度，实现视图从屏幕底部向上平滑“展开显示”的交互效果。
当前处于测试阶段，测试目标为将视图高度从90点逐步增加到140点；动画执行流程、高度约束的修改逻辑均正常运行，但视图的背景显示效果不符合预期。

异常表现 #

• 视图高度增长过程中，视图底部始终固定在屏幕底部位置
• 初步判断问题来自视图的原始高度限制，导致背景色无法填充新增的高度区域，最终动画视觉效果更接近视图沿Y轴平移，而非预期的高度拉伸
• 实际效果示意：
  

当前实现代码 #

func didRequestMatch(friend: Friend) {
    self.friendChallengeLabel.text = friend.name.isEmpty ? friend.email : friend.name
    self.challengeViewHeight.constant = 140
    UIView.animate(withDuration: 2) {
        self.view.layoutIfNeeded()
    }
}

问题排查过程 #

为验证动画逻辑确实是修改视图高度、而非修改Y轴位置的平移动画，开发者通过Debug View Hierarchy进行了层级校验：

调试过程中获取的视图实际属性描述如下：

Printing description of $16:
<UIView: 0x7fc119419eb0; frame = (87.5 527; 200 140); clipsToBounds = YES; autoresize = RM+BM; autoresizesSubviews = NO; layer = <CALayer: 0x600002b66ec0>>

从调试结果可以确认，修改约束完成后，视图实际高度已经达到140，不存在位置平移的逻辑错误。
该视图通过Storyboard完成创建与约束配置，相关约束配置详情如下：

核心疑问 #

• 导致当前异常显示效果的根本原因是什么
• 需要做哪些配置调整，才能实现预期的从底部平滑展开的高度动画效果

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