Swift中实现ImageView从右向左裁剪的宽度动画问题

要实现图片紧贴父视图左边缘、仅从右侧裁剪的动画，核心是解决anchorPoint修改后视图偏移的问题，具体步骤如下：

• 先确保图片的内容模式和裁剪设置正确：

  imageView.contentMode = .scaleAspectFill
  imageView.clipToBounds = true
  

• 修改layer.anchorPoint为(0, 0.5)（让锚点落在左边缘中点），但必须同步调整layer的position来抵消偏移。因为默认锚点是(0.5, 0.5)，修改锚点后系统会自动调整视图位置，所以我们要手动修正：

  // 记录当前左边缘的位置
  let leftEdgeX = imageView.frame.origin.x
  // 修改锚点为左边缘中点
  imageView.layer.anchorPoint = CGPoint(x: 0, y: 0.5)
  // 重新设置position，让左边缘保持在原来的位置
  imageView.layer.position = CGPoint(x: leftEdgeX, y: imageView.layer.position.y)
  

• 接下来添加宽度动画，此时动画会以左边缘为锚点，仅从右侧缩小裁剪：

  let animation = CABasicAnimation(keyPath: "bounds.size.width")
  animation.fromValue = 250
  animation.toValue = 50
  animation.duration = 1.0 // 可自定义动画时长
  animation.fillMode = .forwards
  animation.isRemovedOnCompletion = false // 让动画结束后保持最终状态
  
  imageView.layer.add(animation, forKey: "widthClipAnimation")
  
  // 同步更新layer的实际bounds，避免动画结束后回弹
  imageView.layer.bounds.size.width = 50
  

这样设置后，动画过程中图片会始终紧贴左边缘，只从右侧逐渐裁剪，完全符合需求。

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