SwiftUI picker .onChanged only firing on 2+ selection changes

Question

I have a picker that will change an attribute of an object that is bound to the view. When the picker is changed I want to update the bound object so the change is apparent in the previous view. The picker updates the label on each change but the .onChanged modifier does't fire after the first change. If changed 2 or more times the .onChanged body fires.

let categories: [String] = ["None", "Produce", "Dairy/Eggs", "Meat", "Breads", "Canned Goods", "Baking", "Frozen", "Bulk", "Snack Foods", "Spices/Seasonings", "Pasta/Rice", "Drinks", "Liquor", "Condiments"]

    //Name of recipe received from previous view
    @Binding var ingredient: Ingredient
   
    
    //ingredient variable that can be updated
    @State var category: String = ""

    var body: some View {
        VStack(alignment: .leading) {
                Text(ingredient.name)
                    .font(.title)
                    .padding(.leading, 5)
                Menu {
                    Picker("picker", selection: $category) {
                        ForEach(categories, id: \.self) {
                            Text($0)
                        }
                    }
                    .onChange(of: category, perform: { newValue in
                        print("PICKER CHANGED")
                        ingredient.category = self.category

                    })
                    .labelsHidden()
                    .pickerStyle(InlinePickerStyle())
                    
                } label: {
                    Text(category)
                        .foregroundColor(.black)
                        .padding(5)
                        .labelsHidden()
                        .clipped()
                        .mask(RoundedRectangle(cornerRadius: 20, style: .continuous))
                }
         }
    .onAppear(perform: {self.category = ingredient.category})
}

Ingredient class:

class Ingredient: Identifiable, Hashable{
    static func == (lhs: Ingredient, rhs: Ingredient) -> Bool {
        if (lhs.id == rhs.id) {return true}
        else {return false}
    }
    
    func hash(into hasher: inout Hasher) {
        hasher.combine(id)
    }
    
    public var id = UUID()
    public var name: String = ""
    public var inStock: Bool = false
    public var category: String = ""
    public var keepInStock: Bool = false
}

@loremipsum That works but the label is not updating. Also, suppose I want to store the change in a DB, is there any alternative to .onChanged, I was thinking .onDisappear. — Dean Stirrat
– Dean Stirrat, Commented Apr 2, 2022 at 20:17
Just get. rid of the @State var category it isn't needed. By connecting it all through $ingredient.category when you persist to a database it will all get updated. It is best to have a Save Button. onAppear, onChange, and onDismiss seems to be unreliable. You can try but I would not count on them — lorem ipsum
– lorem ipsum, Commented Apr 2, 2022 at 20:23
I made those changes and it works well. But the label does not update. I'm using a hacky label thing on top of the picker so that may be why there is an issue. It doesn't update when the bound ingredient object is changed. — Dean Stirrat
– Dean Stirrat, Commented Apr 3, 2022 at 18:26
Because ingredient is a class change it to a struct OR make it an ObservableObject wrap the variables in @Published and change @Binding var ingredient: Ingredient to @ObservedObject var ingredient: Ingredient — lorem ipsum
– lorem ipsum, Commented Apr 3, 2022 at 19:40

pkamb · Accepted Answer · 2022-05-06 20:56:04Z

1

This issue is because SwiftUI does not know about the changes.

Ingredient is a class change it to a struct

OR

make it an ObservableObject wrap the variables in @Published and change

@Binding var ingredient: Ingredient

to

@ObservedObject var ingredient: Ingredient

class is reference type and struct is value type.

@State, @Binding, @Published see changes for value type.

@ObservedObject, @StateObject, and @EnvironmentObject are for reference. Accompanied by ObservableObject and @Published

edited May 6, 2022 at 20:56

pkamb

35.5k27 gold badges174 silver badges207 bronze badges

answered Apr 3, 2022 at 23:17

lorem ipsum

30.9k7 gold badges42 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MarlonJames · Accepted Answer · 2022-04-03 08:13:13Z

0

Have you tried setting a tag modifier on the Text property inside the ForEach for the picker?

Picker("picker", selection: $category) {
    ForEach(categories, id: \.self) {
        Text($0).tag($0)
    }
}

answered Apr 3, 2022 at 8:13

MarlonJames

185 bronze badges

1 Comment

Dean Stirrat Over a year ago

Tried this but it still results in the same behavior. I am getting the right value but it is delayed by one interaction. .onChange doesn't recognize the first changed make with the picker, but the second and all subsequent changes are recognized. Its as if after detecting the first change the program breaks and then finishes firing after the next change is made.

Collectives™ on Stack Overflow

SwiftUI picker .onChanged only firing on 2+ selection changes

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related