When the NavigationView is in the root, and NavigationLink is in the subView, like the code below, the label of navigation link cannot take the full width of screen.

If I move the NavigationView to the subView(ListView), the label will be full width, but I cannot navigate to a full screen destination.

Can anyone help? the requirement is 1. full width of navigation link label and 2. navigate to a full screen view. Or should I use fullScreenCover to do this?

    struct ContentView: View {
        var body: some View {
            NavigationView {
                VStack {
                    ListView()
                    Text("Tabs here")
                }
            }
        }
    }
    
    struct ListView: View {
        var body: some View {
            List {
                NavigationLink(
                    destination: Text("detail for item1"),
                    label: {
                        Text("item1")
                    }
                )
                NavigationLink(
                    destination: Text("detail for item2"),
                    label: {
                        Text("item2")
                    }
                )
            }
        }
    }

CodePudding user response：

Using PlainListStyle() will cause the rows to take up the entire width:

List {
  NavigationLink(
      destination: Text("detail for item1"),
      label: {
          Text("item1")
      }
  )
  NavigationLink(
      destination: Text("detail for item2"),
      label: {
          Text("item2")
      }
  )
}.listStyle(PlainListStyle())