Hey guys, I am trying to animate curves in SwiftUI, I have a BezierShape defined like this:
struct BezierShape: Shape {
var startPoint: CGPoint
var curves: [Curve]
init(startPoint: CGPoint, curves: [Curve]) {
self.startPoint = startPoint
self.curves = curves
}
func path(in rect: CGRect) -> Path {
var path = Path()
let width = rect.size.width
let height = rect.size.height
// Move the the start point
let startPoint = CGPoint(x: startPoint.x*width, y: startPoint.y*height)
path.move(to: startPoint)
// Draw the curves
for c in curves {
path.addCurve(to: CGPoint(x: c.destination.x*width, y: c.destination.y*height),
control1: CGPoint(x: c.control1.x*width, y: c.control1.y*height),
control2: CGPoint(x: c.control2.x*width, y: c.control2.y*height))
}
return path
}
}
struct Curve {
var destination: CGPoint
var control1: CGPoint
var control2: CGPoint
}
To animate the bezier shape, I am changing the values passed as parameters to this struct, but since I didn’t include an animatableData property, SwiftUI doesn’t know how to animate these values. I know that to create this property I must use values that conform to VectorArithmetic, so for the start point property I can use its x- and y-values, as these conform to VectorArithmetic. But the array of Curve values doesn’t. And I don’t know how I can make it conform to VectorArithmetic. If someone could help me with this that would be greatly appreciated!
P.S. I’ve found this article from Swift with Majid (https://swiftwithmajid.com/2020/06/17/the-magic-of-animatable-values-in-swiftui/) explaining how to make an array conform to VectorArithmetic with the use of Accelerate, this gave me a better understanding of the situation and how I could approach it, but I don’t know Accelerate nor VectorArithmetic enough to be able to find a solution with this article.