How to create a stepper and read values from it

Paul Hudson @twostraws May 19th 2020

Updated for Xcode 12.0

SwiftUI’s Stepper control lets users select values from a range we specify, providing the same functionality as UIStepper from UIKit.

As an example, this creates a stepper bound to an age property, letting users select values in the range 0 through 130 inclusive:

struct ContentView: View {
    @State private var age = 18

    var body: some View {
        VStack {
            Stepper("Enter your age", value: $age, in: 0...130)
            Text("Your age is \(age)")
        }
    }
}

Rather than binding directly to a value, you can also provide custom onIncrement and onDecrement closures to do custom work, like this:

struct ContentView: View {
    @State private var age = 18

    var body: some View {
        VStack {
            Stepper("Enter your age", onIncrement: {
                self.age += 1
                print("Adding to age")
            }, onDecrement: {
                self.age -= 1
                print("Subtracting from age")
            })

            Text("Your age is \(age)")
        }
    }
}

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

How to create a stepper and read values from it

Similar solutions…