NavigationLinks are all combined into one

Question

Created Nov ’20

Replies 2

Boosts 1

Participants 2

Hi there! I'm trying to separate my NavigationLinks because when I click a navigationLink, the entire VStack gets clicked but I only wan't one NavigationLink. Could someone help me fix this?

Code Block swift var body: some View {
    VStack {
      GeometryReader { geometry in
        VStack {
          List {
            VStack(alignment: .leading) {
              Text("Open:").font(.headline).padding()
              Divider()
              ForEach(self.viewModel.eventsList) { event in
                if event.completed == false {
                  NavigationLink(destination: EventInProgressView(event: event) .environmentObject(viewModel)) {
                    EventsListItemView(event: event)
                    .foregroundColor(Color.black)
                      .environmentObject(viewModel)
                  }
                }
              }.onDelete(perform: delete)
            }
//there's some more stuff down here

Answered by OOPer in 644225022

//there's some more stuff down here

You should better include all the code to reproduce your issue. Nearby view or enclosing view may affect the behavior.

With putting a VStack directly under the List, you are telling SwiftUI to treat the VStack as a single item.

Can't you use Section?

Code Block     var body: some View {
        VStack {
            GeometryReader { geometry in
                VStack {
                    List {
                        Section(header:
                                    VStack(alignment: .leading) {
                                        Text("Open:").font(.headline).padding()
                                        Divider()
                                    }
                        ) {
                            ForEach(self.viewModel.eventsList.filter{!$0.completed}) { event in
                                NavigationLink(destination: EventInProgressView(event: event) .environmentObject(viewModel))
                                {
                                    EventsListItemView(event: event)
                                        .foregroundColor(Color.black)
                                        .environmentObject(viewModel)
                                }
                            }.onDelete(perform: delete)
                        }
                        //there's some more stuff down here
                    }
                }
            }
        }
    }

Boost

Answer 1

OOPer OP

Nov ’20

Accepted Answer

//there's some more stuff down here

You should better include all the code to reproduce your issue. Nearby view or enclosing view may affect the behavior.

With putting a VStack directly under the List, you are telling SwiftUI to treat the VStack as a single item.

Can't you use Section?

Code Block     var body: some View {
        VStack {
            GeometryReader { geometry in
                VStack {
                    List {
                        Section(header:
                                    VStack(alignment: .leading) {
                                        Text("Open:").font(.headline).padding()
                                        Divider()
                                    }
                        ) {
                            ForEach(self.viewModel.eventsList.filter{!$0.completed}) { event in
                                NavigationLink(destination: EventInProgressView(event: event) .environmentObject(viewModel))
                                {
                                    EventsListItemView(event: event)
                                        .foregroundColor(Color.black)
                                        .environmentObject(viewModel)
                                }
                            }.onDelete(perform: delete)
                        }
                        //there's some more stuff down here
                    }
                }
            }
        }
    }

0

Answer 2

danieldang OP

Nov ’20

Yeah I didn't like using Section because it made the background of the section header gray, and I couldn't figure out how to change it.. I guess I have to use it and just deal with it! Thanks :)

0