4

Somewhere in my code I have this pretty standard list with sections:

var body: some View {
    List {
        ForEach(userData.groupedBookings) { group in
            Section(header: Text(group.key)) {
                ForEach(group.items) { booking in
                    LessonRow(booking: booking)
                }
            }
        }
    }
}

Somehow with this code the sections are expandable/collapsable, which makes me happy, but I don't know why. I'm especially frustrated because I want to reproduce this behavior elsewhere with similar code and don't get the expand / collapse.

What are the requirement to automatically get this?

lorenzo
  • 1,487
  • 1
  • 17
  • 25

1 Answers1

5

It is activated by sidebar list style (which in some conditions are considered as default), which you can use explicitly

List {
    ForEach(userData.groupedBookings) { group in
        Section(header: Text(group.key)) {
            ForEach(group.items) { booking in
                LessonRow(booking: booking)
            }
        }
    }
}
.listStyle(SidebarListStyle())

as alternate you can use DisclosureGroup explicitly to have disclosure behavior for sections, like in https://stackoverflow.com/a/63228810/12299030

Asperi
  • 228,894
  • 20
  • 464
  • 690
  • Thanks. It's close but the style is not eaxctly the same. I get large section text + clear list backgrounds, whereas my code gets small section text + white header. I tried DisclosureGroup but also got another styling as I'm looking for consistency. – lorenzo Dec 02 '20 at 15:53
  • 1
    That was due to `.navigationViewStyle(StackNavigationViewStyle())` – lorenzo Dec 02 '20 at 15:57