swiftswiftui-pickerswiftui-datepicker

SwiftUI TimePicker Bindings to the view of the parent view


Hello, I would like to take some advice on my requirement. I have a parent view which has a child view and that has one more child view. Basically, I would like to pass the binded value to the parent view. Parent View (SubChildView-Value) -> Child View -> SubChildView (To be passed from here to the parent view). Below is the logic which I have written.

  struct Parent: View {
    @State var dateChosen: Date = Date()
    var dateToDisplay: Date

    var body: some View {
        ChildPickerView(pickerType: .DatePicker, chosenDate: $dateChosen)
             // If I uncomment the below onChange lines, the binding from subchild would work
             //.onChange(of: dateChosen) { newValue in
            //    dateChosen = newValue
            // }
        Text("Date Selected: \(**dateChosen**)") // I would like this value to be read from SubChildPickerView ?!! How to achieve this ?
    }
}


struct Parent_Previews: PreviewProvider {
    static var previews: some View {
        VStack {
            ChildPickerView(dateChosen: Date(), dateToDisplay: .now)
        }.padding(16.0)
    }
}

struct ChildPickerView: View {
    @State var pickerType: PickerType
    @State var selectedDate: Date = Date()
    @Binding var chosenDate: Date

    var body: some View {
            SubChildPickerView(selectedDate: $selectedDate)
//    If I uncomment the below lines, the bindings to the parent view works
//                .onChange(of: selectedDate) { newValue in
//                    chosenDate = newValue
//                }
            Text("picker view: \(selectedDate)")
    }

    struct SubChildPickerView: View {
        @Binding var selectedDate: Date // Can I get rid of this binding here or somehow make this value being read by ParentPickerView?

        var body: some View {
            let datePicker = DatePicker("", selection: **$selectedDate,**
                                        in: Date()...,
                                        displayedComponents: .hourAndMinute)
                .datePickerStyle(.wheel)
                .padding()

            VStack {
                GeometryReader { geometry in
                    datePicker
                        .frame(width: geometry.size.width, height: geometry.size.height)
                        .clipped()
                }
            }
        }
    }
}

Solution

  • Thanks. I have managed to fix this issue using the binding. Below is the code.

     struct ParentView: View {
        @State var selectedDate: Date = Date()
    
        var body: some View {
            ChildPickerView(selectedDate: $selectedDate)
            Text("subchild chosen date view \(selectedDate)")
        }
    }
    
    struct ParentView_Previews: PreviewProvider {
        static var previews: some View {
            VStack {
                ParentView(selectedDate: Date())
            }.padding(16.0)
        }
    }
    
    struct ChildPickerView: View {
        @Binding var selectedDate: Date
    
        var body: some View {
            PickerView(selectedDate: $selectedDate, pickerType: pickerType)
        }
    
        struct SubChildPickerView: View {
            @Binding var selectedDate: Date
    
            var body: some View {
                let datePicker = DatePicker("", selection: $selectedDate,
                                            in: Date()...,
                                            displayedComponents: .hourAndMinute)
                    .datePickerStyle(.wheel)
                    .padding()
    
                VStack {
                    GeometryReader { geometry in
                        datePicker
                            .frame(width: geometry.size.width, height: geometry.size.height)
                            .clipped()
                    }
                }
            }
        }
    }