iOS16 SwiftUI Table是否支持类似DisclosureGroup的可展开子项功能？

iOS16的Table组件本身没有内置和DisclosureGroup完全一致的展开折叠能力（因为Table默认是严格的列对齐结构），但可以通过嵌套DisclosureGroup+自定义跨列单元格的方式，同时实现Table自动列宽适配和自定义子UI的展开需求，具体实现如下：

核心实现思路 #

• 手动维护行的展开状态：用Set存储已展开行的ID，通过Binding控制DisclosureGroup的展开状态
• 让自定义子UI占满整行：利用TableColumn的columnSpan参数，让子内容跨所有列，突破Table的列对齐限制

完整代码示例 #

struct ContentView: View {
    let someObject: [ParentViewModel]
    @State private var expandedRowIDs: Set<ParentViewModel.ID> = []

    var body: some View {
        Table(someObject) {
            // 定义Table列，组件会自动适配列宽
            TableColumn("主标题") { vm in
                Text(vm.mainTitle)
            }
            TableColumn("辅助信息") { vm in
                Text(vm.subInfo)
            }
            // 可根据需求添加更多列
        } rowContent: { vm in
            TableRow {
                DisclosureGroup(isExpanded: Binding(
                    get: { expandedRowIDs.contains(vm.id) },
                    set: { isExpanded in
                        isExpanded ? expandedRowIDs.insert(vm.id) : expandedRowIDs.remove(vm.id)
                    }
                )) {
                    // 自定义子项：跨所有列的全屏Text
                    TableRow {
                        TableColumn("", columnSpan: 2) { // columnSpan设为你的总列数
                            Text("自定义展开内容：\(vm.childContent)")
                                .frame(maxWidth: .infinity, alignment: .leading)
                                .padding(.vertical, 8)
                                .padding(.horizontal)
                                .background(Color(UIColor.systemGray6))
                        }
                    }
                } label: {
                    // 对应原List中Row的内容，自动适配Table列布局
                    HStack {
                        Text(vm.mainTitle)
                        Spacer()
                        Text(vm.subInfo)
                    }
                }
            }
        }
    }
}

// 示例数据模型
struct ParentViewModel: Identifiable {
    let id = UUID()
    let mainTitle: String
    let subInfo: String
    let childContent: String
}

关键细节说明 #

• Table会自动根据列内容调整宽度，无需手动设置固定尺寸
• 通过columnSpan参数让子内容跨列，完美实现占满宽度的自定义UI
• 展开状态由@State的Set维护，确保状态正确更新

内容的提问来源于stack exchange，提问作者Deitsch