I want to create a pulsing circle with forever repeating animation. It should have a gradual change of size and a momentary change of color when animation direction changes. I have two different animations for that, but only the last one having an effect on both (size and color change).
struct SwiftUIView: View {
@State private var animationStarted = false
let side = UIScreen.main.bounds.size.width
let animation1 = Animation.easeInOut(duration: 0.3).delay(5.7)
.repeatForever(autoreverses: true)
let animation2 = Animation.easeInOut(duration: 6)
.repeatForever(autoreverses: true)
var body: some View {
HStack {
VStack {
HStack {
Circle()
.foregroundColor(self.animationStarted ? Color.pink : Color.blue)
.animation(animation1)
.frame(width: self.animationStarted ? 10 : side, height: self.animationStarted ? 10 : side)
.animation(animation2)
.onAppear {
self.animationStarted.toggle()
}
}
}.frame(height: side)
}.frame(width: side)
}
}