Search code examples
viewswiftui

SwiftUI Question passing a variable to another view


I am wanting to pass a Float Variable from one view to another new view.

In the code below there is a Float value called mhzValue which is set by way of the Slider, the slider changes the value and Text is then displaying within the view.. When the user taps on the Navigation Button to display the new view, I would like to be able to take the mhzValue and display it in the new view in a text box, as well as set it as another variable.

Hope that makes sense.

Please see some sample code below..

Thank you.

Craig

import SwiftUI
struct ContentView : View {
    @State private var mhzValue : Float = 0
    var body: some View {
        // Navigation View
        NavigationView {

            VStack{
                Text("Test Value:")
                    .font(.headline)
                    .color(.blue)
                    .padding(.leading, -180.0)

                //Get Slider Value
                Slider(value: $mhzValue, from: 1, through: 55, by: 1)
                    .padding(.horizontal)
                //Display Slider Value
                Text("\(Int(mhzValue)) Value")
                    .font(.title)
                    .fontWeight(.semibold)
                    .color(.blue)
                // Naviagtion Button and send value of mhzValue to new View
                NavigationButton(destination: NextView()){
                    Image(systemName: "plus.square.fill")
                        .foregroundColor(.white)
                        .font(/*@START_MENU_TOKEN@*/.title/*@END_MENU_TOKEN@*/)
                        .frame(width: 150.0, height: 16.0)
                        .padding(15)
                        .background(Color.red)
                        .cornerRadius(10.0)
                }
            }
        }
    }
}

// New View to show Slider Value
struct NextView : View {
    var body: some View {
        Text("Display Slider Value Here:")

    }
}

#if DEBUG
struct ContentView_Previews : PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
#endif

Solution

  • This is easily done with Bindings. Because mhzValue is marked with the @State property wrapper, it has an associated Binding. You can therefore declare a @Binding variable in your second view, and initialize it with the Binding to the original variable.

    struct NextView : View {
        @Binding var mhzValue: Float
        ...
    }
    

    When you specify NextView as the destination for your navigation button, pass it a Binding to mhzValue. (The dollar-sign syntax is a shorthand way to refer to the binding.)

    struct ContentView : View {
        @State private var mhzValue : Float = 0
        ...
        NavigationButton(destination: NextView(mhzValue: self.$mhzValue)){...}
        ...
    }
    

    You can then use mhzValue inside NextView:

    struct NextView : View {
    
        @Binding var mhzValue: Float
    
        var body: some View {
            VStack{
                Text("Display Slider Value Here:")
                Text("\(Int(mhzValue)) Value")
                    .font(.title)
                    .fontWeight(.semibold)
                    .color(.blue)
            }
        }
    }
    

    Any changes you make to mhzValue within NextView will effectively be changes to ContentView.mhzValue.