SwiftUI侧边栏List默认展开，如何设置初始折叠状态？

要让Sidebar样式的List默认处于折叠状态，你需要手动控制每个Section的折叠状态——虽然官方文档说明默认应为折叠，但实际场景中可能因Section内容结构或系统版本差异，需要显式绑定状态来实现预期效果。

修改后的完整代码 #

import SwiftUI

struct ContactView: View {
    // 初始化所有Section为折叠状态（false=折叠，true=展开）
    @State private var sectionExpansions = Array(repeating: false, count: 5)
    
    var body: some View {
        List {
            contactSection(
                title: "HR Department", 
                phone: "(123) 456 - 7890", 
                fax: "(123) 456 - 7890",
                isExpanded: $sectionExpansions[0]
            )
            contactSection(
                title: "Customer Service Department", 
                phone: "(123) 456 - 7890",
                isExpanded: $sectionExpansions[1]
            )
            contactSection(
                title: "Technical Support Department", 
                phone: "(123) 456 - 7890", 
                afterHours: "(123) 456 - 7890", 
                email: "support@support.com",
                isExpanded: $sectionExpansions[2]
            )
            contactSection(
                title: "Product Sales Department", 
                email: "sales@sales.com",
                isExpanded: $sectionExpansions[3]
            )
            contactSection(
                title: "Contact App Developer", 
                email: "appdev@appdev.com",
                isExpanded: $sectionExpansions[4]
            )
            Text("Office hours at this company is from Monday through Friday from 9:00 AM - 5:00 PM Eastern Time")
                .font(.headline)
                .fontWeight(.bold)
                .multilineTextAlignment(.center)
        }
        .listStyle(.sidebar)
        .navigationTitle("Contact Info")
    }
    
    // 更新contactSection方法，添加折叠状态绑定参数
    private func contactSection(
        title: String, 
        phone: String? = nil, 
        fax: String? = nil, 
        afterHours: String? = nil, 
        email: String? = nil,
        isExpanded: Binding<Bool>
    ) -> some View {
        Section(
            header: Text(title)
                .font(.headline)
                .fontWeight(.bold)
                .foregroundColor(.primary)
                .multilineTextAlignment(.center),
            collapsed: isExpanded // 绑定折叠状态
        ) {
            if let phone = phone {
                contactItem(label: "Phone:", value: phone)
            }
            if let fax = fax {
                contactItem(label: "Fax:", value: fax)
            }
            if let afterHours = afterHours {
                contactItem(label: "After Hours Support:", value: afterHours)
            }
            if let email = email {
                contactItem(label: "Email:", value: email)
            }
        }
    }
    
    private func contactItem(label: String, value: String) -> some View {
        HStack {
            Text(label)
                .font(.headline)
                .padding(.leading)
            Spacer()
            Text(value)
                .font(.headline)
                .foregroundColor(.accentColor)
                .padding(.trailing)
        }
    }
}

struct ContactView_Previews: PreviewProvider {
    static var previews: some View {
        ContactView()
    }
}

关键修改点 #

• 添加@State private var sectionExpansions数组，用false初始化所有Section的折叠状态（数组长度对应Section的数量，这里为5个）。
• 在contactSection方法中新增isExpanded: Binding<Bool>参数，将其绑定到Section的collapsed属性上。
• 调用contactSection时，传入对应索引的状态绑定，实现每个Section独立控制折叠状态。

这个方案通过显式管理每个Section的折叠状态，确保视图初始化时所有Section都处于折叠状态，同时保留用户手动展开/折叠的交互功能。

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