iOS：翻转动画中MasksToBounds失效问题

这个问题我之前做卡片翻转动画时也碰到过！其实核心原因和Core Animation处理3D变换与2D裁剪的逻辑有关，我给你拆解下：

为什么圆角会在动画中失效？ #

• 当你给父视图设置layer.masksToBounds = true时，它的裁剪是基于2D平面的。而翻转动画依赖CATransform3D实现3D透视效果，动画过程中子视图会有部分区域超出父视图的原始平面范围，这时候2D裁剪就无法正确覆盖这些3D变换后的区域，导致圆角看起来“消失”了。
• 另外，cornerRadius的渲染逻辑是针对图层的原始平面，当图层进行3D变换后，Core Animation不会自动给变换后的边缘应用圆角，这也会让圆角在动画过程中失效。

靠谱的解决方案 #

方案一：用CAShapeLayer作为父视图的蒙版（替代masksToBounds） #

给父视图添加一个圆角路径的蒙版，同时给两个子视图也设置相同的圆角，这样不管子视图怎么3D变换，都会被蒙版正确裁剪：

// 1. 创建父视图的圆角蒙版路径
let maskPath = UIBezierPath(roundedRect: parentView.bounds, cornerRadius: yourCornerRadius)
let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
parentView.layer.mask = maskLayer

// 2. 给两个子视图设置相同的圆角（不要给子视图开masksToBounds，避免内部内容被裁剪）
frontView.layer.cornerRadius = yourCornerRadius
backView.layer.cornerRadius = yourCornerRadius

如果父视图的尺寸会变化，记得在layoutSubviews（自定义视图）或viewDidLayoutSubviews（ViewController）里更新蒙版路径：

override func layoutSubviews() {
    super.layoutSubviews()
    let maskPath = UIBezierPath(roundedRect: bounds, cornerRadius: yourCornerRadius)
    (layer.mask as? CAShapeLayer)?.path = maskPath.cgPath
}

方案二：外层嵌套容器视图做裁剪 #

再套一层容器视图，把翻牌的父视图放在容器里，让容器负责圆角和裁剪，这样翻牌的3D变换完全在容器内部进行，不会影响外层的裁剪逻辑：

// 创建容器视图
let containerView = UIView(frame: parentView.frame)
containerView.layer.cornerRadius = yourCornerRadius
containerView.layer.masksToBounds = true

// 将翻牌父视图添加到容器中
parentView.frame = containerView.bounds
containerView.addSubview(parentView)

// 把容器视图添加到你的视图层级
self.view.addSubview(containerView)

如果用Auto Layout，只需要给容器视图和翻牌父视图添加约束，保证两者尺寸一致即可。

方案三：针对iOS 11+的精准圆角控制 #

如果只需要特定角的圆角，可以用maskedCorners配合蒙版，让裁剪更灵活：

// 父视图和子视图设置相同的圆角与指定角
let targetCorners: CACornerMask = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
let cornerRadius: CGFloat = 16

parentView.layer.cornerRadius = cornerRadius
parentView.layer.maskedCorners = targetCorners
frontView.layer.cornerRadius = cornerRadius
frontView.layer.maskedCorners = targetCorners
backView.layer.cornerRadius = cornerRadius
backView.layer.maskedCorners = targetCorners

// 给父视图添加对应圆角的蒙版
let maskPath = UIBezierPath(roundedRect: parentView.bounds, byRoundingCorners: UIRectCorner(targetCorners), cornerRadii: CGSize(width: cornerRadius, height: cornerRadius))
let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
parentView.layer.mask = maskLayer

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