macosswiftui

SwiftUI on macOS - using Picker for each row in a TableColumn


I am displaying some items in a Table on macOS (new in SwiftUI 3.0). I can get the table to work fine when displaying Text views in each column, but I really want to show a Picker view in one of the columns. But I'm not sure how I would 'bind' the selection of the picker to an item in the array that I use to drive the list of items.

Here's the code I'm trying:

struct TestSwiftUIView: View {
    
    @State var mappingFields: [ImportMappingField]
    
    var body: some View {
        
        VStack {
            Table(mappingFields) {
                
                TableColumn("Imported Field") { item in
                    Text("\(item.columnName)")
                }.width(160)
                TableColumn("Mapped Field") { item in
                    Text("\(item.fieldName.typeNameAndDescription.description)")
                }.width(150)
                
                TableColumn("Type") { item in
                    Picker("", selection: $item.selectedCustomFieldType){ // error here
                        ForEach(ImportMappingType.allCases, id:\.self ) { i in
                                Text(i)
                        }
                    }
                }.width(100)
            }
        }
    }
}

In selection: $item.selectedCustomFieldType I get an error that says

"Cannot find '$item' in scope"

So I want to bind each picker to an element in each 'item', but it doesn't let me do that.

Is there a good solution for this problem?


Solution

  • try using this approach to give you the item binding you need:

    Table($mappingFields) {  // <-- here
    
                    TableColumn("Type") { $item in  // <-- here
                        Picker("", selection: $item.selectedCustomFieldType){
                        ...
                        }
    

    similarly for the other TableColumn. You may have to make ImportMappingField conform to Identifiable