只需一次点击即可从MacOS上的SwiftUI列表中取消选择项目 [英] Deselect Items from SwiftUI List on macOS with single click

问题描述

我正在开发一个带有List带有可选行的视图的MacOS应用程序。 因为很遗憾没有editMode

在MacOS上，可以单击选择单元格，但取消选择执行相同操作的已选择单元格不会产生任何影响。 取消选择单元格的唯一选项是CMD + Click，这不是很直观。
最小示例：

struct RowsView: View {
    
    @State var selectKeeper: String?
    
    let rows = ["1", "2", "3", "4", "5", "6", "7", "8"]
    
    var body: some View {
        List(rows, id: .self, selection: $selectKeeper) { row in
            Text(row)
        }
    }
}

struct RowsView_Previews: PreviewProvider {
    static var previews: some View {
        RowsView()
    }
}

单击或甚至双击第3行不执行任何操作，并且该行保持选中状态。

---

直接绑定
我已尝试按照Pickerhere的出色答案中所述直接附加Binding，但这似乎不适用于MacOS上的List：

...
    var body: some View {
        List(rows, id: .self, selection: Binding($selectKeeper, deselectTo: nil)) { row in
            Text(row)
        }
    }
...

public extension Binding where Value: Equatable {
                
    init(_ source: Binding<Value>, deselectTo value: Value) {
        self.init(get: { source.wrappedValue },
                  set: { source.wrappedValue = $0 == source.wrappedValue ? value : $0 }
        )
    }
}

关于如何在不重建选择机制的情况下实现单击取消选择，您有什么想法吗？

^{记录：Xcode 13.2.1，MacOS BigSur 11.6.2}

推荐答案

我们可以使用自己的手势阻止默认的点击处理，并手动管理选择。

这里是可能的方法的演示。在Xcode 13.2/MacOS 12.1上测试

struct RowsView: View {

    @State var selectKeeper: String?

    let rows = ["1", "2", "3", "4", "5", "6", "7", "8"]

    var body: some View {
        List(rows, id: .self, selection: $selectKeeper) { row in
            Text(row)
                .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
                .contentShape(Rectangle())      // handle click row-wide
                .listRowInsets(EdgeInsets())    // remove default edges
                .onTapGesture {
                    selectKeeper = selectKeeper == row ? nil : row   // << here !!
                }
                .padding(.vertical, 4)          // look&feel like default
        }
    }
}

这篇关于只需一次点击即可从MacOS上的SwiftUI列表中取消选择项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！