Collapsible section headers

Question

Created Sep ’22

Replies 1

Boosts 0

Views 1.2k

Participants 2

I have a list with sections headers on two views. One view has the section headers as collapsible, the other doesn't. Both use pretty much the same code, what defines if a section header is collapsible? Code for the one that doesn't collapse

        ForEach(cards) { section in
            let header: String = nameForSectionHeader(sectionID: section.id)
            Section(header: Text(header)) {
                ForEach(section) { card in
                    NavigationLink(destination: CardView(card: card)) {
                        HStack {
                            Image(card.imageName ?? "")
                                .renderingMode(.original)
                                .resizable()
                                .scaledToFit()
                                .frame(width: 50.0)
                            VStack(alignment: .leading) {
                                if let name = card.name, let id = card.cardID {
                                    Text("\(id) - \(name)")
                                }
                                Text("Owned: \(card.owned)")
                            }
                        }
                    }
                }
            }
        }
    }

and the code for the one that does

            ForEach(cards) { section in
                let header: String = nameForSectionHeader(sectionID: section.id)
                Section(header: Text(header)) {
                    ForEach(section) { card in
                        NavigationLink(destination: CardView(card: card)) {
                            VStack(alignment: .leading) {
                                if let name = card.name, let id = card.cardID {
                                    Text("\(id) - \(name)")
                                }
                                if let set = card.set, let setName = set.name {
                                    Text("Set: \(setName)")
                                }
                                if card.owned > 0 {
                                    Text("Owned: \(card.owned)")
                                }
                            }
                        }
                    }
                }
            }
            .listRowBackground(lightGreen)
        }

Boost

Answer 1

aandyzoom01 OP

Jun ’23

I use to have my Sections (with header) within a List View that was within a NavigationView. Since NavigationView is now deprecated, I've transitioned to using NavigationStack. No other changes to code, but now my section headers don't have a triangle to show/hide the section content...i.e. the section is now longer collapsible. Your code above doesn't show what your ForEach statements are wrapped in. Are they within a List?

0