iOS 15+ SwiftUI中移除DisclosureGroup原生箭头的技术问询

以下是两种实用方案，解决箭头占位导致自定义label无法占满宽度的问题：

方案一：自定义DisclosureGroupStyle（推荐） #

完全重写DisclosureGroup的样式，移除箭头并让自定义label自动占满宽度：

// 定义无箭头的DisclosureGroup样式
struct NoArrowDisclosureGroupStyle: DisclosureGroupStyle {
    func makeBody(configuration: Configuration) -> some View {
        VStack(alignment: .leading, spacing: 0) {
            // 自定义label占满宽度，点击切换展开状态
            configuration.label
                .frame(maxWidth: .infinity)
                .onTapGesture {
                    configuration.isExpanded.toggle()
                }
            // 展开时显示内容，可添加缩进保持层级感
            if configuration.isExpanded {
                configuration.content
                    .padding(.leading)
            }
        }
    }
}

// 使用示例
struct ContentView: View {
    @State private var isExpanded = false
    
    var body: some View {
        DisclosureGroup(
            isExpanded: $isExpanded,
            content: {
                Text("my content")
            },
            label: {
                HStack {
                    Text("自定义Label")
                        .foregroundColor(.black)
                }
                .background(Color.yellow)
            }
        )
        .disclosureGroupStyle(NoArrowDisclosureGroupStyle())
    }
}

该方案完全摆脱系统默认箭头布局，自定义label可自然占满整个宽度，无多余空隙。

方案二：通过布局调整隐藏箭头空间 #

若不想自定义样式，可通过修改label布局并隐藏箭头容器：

struct ContentView: View {
    @State private var isExpanded = false
    
    var body: some View {
        DisclosureGroup(
            isExpanded: $isExpanded,
            content: {
                Text("my content")
            },
            label: {
                HStack {
                    Text("自定义Label")
                        .foregroundColor(.black)
                    Spacer() // 推动内容占满宽度
                }
                .background(Color.yellow)
                .frame(maxWidth: .infinity)
            }
        )
        .accentColor(.clear) // 隐藏箭头图标
        .contentShape(Rectangle()) // 确保整个label区域可点击
    }
}

此方法通过frame(maxWidth: .infinity)让label占满宽度，配合contentShape保证点击区域覆盖整个label，彻底消除箭头占位带来的尾部空隙。

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