NEW: My new book Pro SwiftUI is out now – level up your SwiftUI skills today! >>

What is the @GestureState property wrapper?

Paul Hudson    @twostraws   

Updated for Xcode 14.2

SwiftUI gives us a specific property wrapper for tracking the state of gestures, helpfully called @GestureState. Although you can accomplish the same using a simple @State property wrapper, @GestureState comes with the added ability that it automatically sets your property back to its initial value when the gesture ends, and it’s usually significantly faster than using a simple @State as well.

For example, we might want to create a gesture that can drag views around. To do that, we’d first need to create an @GestureState property to store how much the view has been moved, like this:

@GestureState var dragAmount =

That has the default value of, which means when the gesture ends it will return to that value automatically.

Next, we would attach an offset() modifier so that our view gets moved around by whatever value is in dragAmount:


Finally, we would attach a gesture that is bound to our dragAmount property, like this:

        DragGesture().updating($dragAmount) { value, state, transaction in
            state = value.translation

There’s quite a lot of code in there, so let’s unpack it:

  1. The DragGesture().updating() code creates a new drag gesture, asking it to modify the value stored in dragAmount – that’s our CGSize.
  2. It takes a closure with three parameters: value, state, and transaction.
  3. The value parameter is the current data for the drag – where it started, how far it’s moved, where it’s predicted to end, and so on.
  4. The state parameter is an inout value that is our property. So, rather than reading or writing dragAmount directly, inside this closure we should modify state.
  5. The transaction parameter is an inout value that stores the whole animation context, giving us a little information about what’s going on such as whether this is a continuous or transient animation. Continuous animations might be produced by dragging a slider, whereas transient animations might be produced by tapping a button.
  6. To make our view draggable, all we do is assign the current translation the drag straight to state (which is really dragAmount in this case), which in turn is used in the offset() modifier to move the view.

Remember, one of the advantages of @GestureState is that it automatically sets the value of your property back to its initial value when the gesture ends. In this case, it means we can drag a view around all we want, and as soon as we let go it will snap back to its original position.

Hacking with Swift is sponsored by Play

SPONSORED Play is the first native iOS design tool created for designers and engineers. You can install Play for iOS and iPad today and sign up to check out the Beta of our macOS app with SwiftUI code export. We're also hiring engineers!

Click to learn more about Play!

Sponsor Hacking with Swift and reach the world's largest Swift community!

Similar solutions…

Buy Pro Swift Buy Pro SwiftUI Buy Swift Design Patterns Buy Testing Swift Buy Hacking with iOS Buy Swift Coding Challenges Buy Swift on Sundays Volume One Buy Server-Side Swift Buy Advanced iOS Volume One Buy Advanced iOS Volume Two Buy Advanced iOS Volume Three Buy Hacking with watchOS Buy Hacking with tvOS Buy Hacking with macOS Buy Dive Into SpriteKit Buy Swift in Sixty Seconds Buy Objective-C for Swift Developers Buy Beyond Code

Was this page useful? Let us know!

Average rating: 4.4/5

Unknown user

You are not logged in

Log in or create account

Link copied to your pasteboard.