如何在SwiftUI中为BezierPath自定义cornerRadius的变化添加动画

问题根源是你自定义的RoundedCorner形状未声明可动画属性，SwiftUI无法识别radius参数的变化需要做过渡插值，因此没有动画效果。

只需要给RoundedCorner结构体添加animatableData属性，关联圆角半径即可，原有View扩展无需修改：

struct RoundedCorner: Shape {
    var radius: CGFloat = .infinity
    var corners: UIRectCorner = .allCorners
    
    // 新增动画属性映射
    var animatableData: CGFloat {
        get { radius }
        set { radius = newValue }
    }
    
    func path(in rect: CGRect) -> Path {
        let path = UIBezierPath(roundedRect: rect, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
        return Path(path.cgPath)
    }
}

修改后直接运行你原有测试代码，即可观测到自定义圆角的半径变化已经支持平滑过渡动画。

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