I gave up after spending a lot of time trying to do the animation in SwfitUI and ended up reusing the existing UIKit animation using a UIViewRepresentable as suggested in the following thread.
http://stackoverflow.com/questions/70553786/animating-a-swiftui-view-with-uiview-animate/70645853#70645853/
import SwiftUI
struct WrapUIKitAnimationInSwiftUI: View {
@State private var isAnimating = false
var body: some View {
HStack{
Image(systemName: "circle.fill")
.font(.system(size: 65))
.foregroundColor(.blue)
.throwAnimation(isAnimating: $isAnimating)
.onTapGesture {
isAnimating.toggle()
}
}
}
}
struct ThrowAnimationWrapper<Content: View>: UIViewRepresentable{
@ViewBuilder let content: () -> Content
@Binding var isAnimating: Bool
func makeUIView(context: Context) -> UIView {
UIHostingController(rootView: content()).view
}
func updateUIView(_ uiView: UIView, context: Context) {
if isAnimating{
UIView.animateKeyframes(withDuration: 1.5, delay: 0.0, options: [.calculationModeCubic], animations: {
UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.2, animations: {
uiView.center = CGPoint(x: 250, y: 300)
})
UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.9, animations: {
uiView.center = CGPoint(x: 100 + 75, y: 100 - 50 )
uiView.transform = CGAffineTransform(scaleX: 0.75, y: 0.75)
})
UIView.addKeyframe(withRelativeStartTime: 0.1, relativeDuration: 0.7, animations: {
uiView.center = CGPoint(x: 100, y: 100)
uiView.transform = CGAffineTransform(scaleX: 0.2, y: 0.2)
})
}, completion: { _ in
uiView.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
})
}
}
}
extension View {
func throwAnimation( isAnimating: Binding<Bool>) -> some View {
modifier(ThrowAnimationViewModifier(isAnimating: isAnimating))
}
}
struct ThrowAnimationViewModifier: ViewModifier {
@Binding var isAnimating: Bool
func body(content: Content) -> some View {
ThrowAnimationWrapper(content: {
content
}, isAnimating: $isAnimating)
}
}
