Member-only story

How to animate a button to spin on its axis in SwiftUI

Brahim Siempay
1 min readDec 10, 2022

--

Photo by Josh Calabrese on Unsplash

To animate a button to spin on its axis in SwiftUI, you can use the rotationEffect() modifier and animate its angle property. Here is an example:

Button(action: {
// perform some action when the button is tapped
}) {
// button content goes here
}
.rotationEffect(.degrees(animationAmount))
.animation(Animation.easeInOut(duration: 1))

In the example above, animationAmount is a variable that holds the angle of rotation for the button. You can change this value over time to create the spinning animation. The animation() modifier is used to specify the duration and easing of the animation.

You can also use the onAppear() and onDisappear() modifiers to start and stop the animation when the view appears and disappears, respectively. For example:

Button(action: {
// perform some action when the button is tapped
}) {
// button content goes here
}
.rotationEffect(.degrees(animationAmount))
.animation(Animation.easeInOut(duration: 1))
.onAppear {
// start the animation when the view appears
}
.onDisappear {
// stop the animation when the view disappears
}

Hope this helps!

--

--

Brahim Siempay
Brahim Siempay

No responses yet