Two Back headers after NavigationLink

Hi,


From my ContentView I use a NavigationLink to go to an Order Overview WarehouseOrderOverview()


NavigationView{
  ScrollView{
  VStack{
  NavigationLink(destination: WarehouseOrderOverview().environmentObject(self.settingStore).navigationBarTitle("Orders")) {
  MenuButtonNavigation(title: "Order overview", color: Color.gray, icon: "doc.text.magnifyingglass").padding(.top)
  }

WarehouseOrderOverview:

var body: some View {

  List(warehouseOrderController.warehouseOrders){ warehouseOrder in
  NavigationLink(destination: WarehouseOrderView(warehouseOrder: warehouseOrder).environmentObject(self.settingStore).navigationBarTitle("Details")){
  OrderTableRow(warehouseOrder: warehouseOrder)
  }


So far so good. If I now tap a row in that view, I get to the order details view WarehouseOrderView


NavigationView{
  ScrollView() {
  VStack{
  VStack(spacing: -25) {
  HStack(spacing: -25) {
  NavigationLink(destination: WarehouseOrderLinesView(warehouseOrderLines: warehouseOrderLineController.warehouseOrderLines)){
  TaskSummaryView(title: "Total Lines", color: .blue, icon: "list.dash", value: warehouseOrderLineController.warehouseOrderLines.count)
  }

Problem is now that when I tap the TaskSummaryView, it opens the WarehouseOrderLinesView with two navigation bars on top (one going back to Orders, the other one to the Order details [too bad I cannot post a screenshot here ...])


I believe the issue is that I create a new NavigationView in my WarehouseOrderView but I get an error when trying to use the NavigationLink without embedding it in a NavigationView. Or is there a better way than NavigationLink to open the view WarehouseOrderLinesView?


Max

Answered by DelawareMathGuy in 405753022

hi,


seems to work fine for me if you remove the NavigationView wrapper on the ScrollView in DetailView1 (at line 44).


it might help debugging this if you first add .navigationBarTitle("Main Level") to the ScrollView in the ContentView, and then also .navigationBarTitle("Level X", displayMode: .inline) in each of ListView1 ("X" = "1"), DetailView1 ("X" = "2"), and DetailView2 ("X" = "3"). then you'll see the problem.


hope that helps,

DMG

too bad I cannot post a screenshot here ...


Instead, please post the complete code, so that we can play with it.

Hi Claude31


Sorry for the late reply, please see the complete code example below:


//
//  ContentView.swift
//  Two Navbars
//
//  Created by Max on 2020-02-05.
//  Copyright © 2020 Max. All rights reserved.
//

import SwiftUI

struct ContentView: View {
  var body: some View {
  NavigationView{
  ScrollView{
  VStack{
  NavigationLink(destination: ListView1()){
  Text("Tap me")
  }

  Text("Nothing here")
  }
  }
  }
  }
}

struct ListView1: View {

  var body: some View {
  List{
  NavigationLink(destination: DetailView1()){
  Text("Tap me one more time")
  }

  Text("Item 2")
  Text("Item 3")
  }
  }
}

struct DetailView1: View {

  var body: some View {
  NavigationView{
  ScrollView() {
  VStack{
  NavigationLink(destination: DetailView2()){
  Text("Drill down more")
  }
  Text("Nothing here")
  }
  }
  }
  }
}

struct DetailView2: View {

  var body: some View {
  List {
  Text("That's it")
  Text("Nothing here")
  }
  }
}




struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
  ContentView()
  }
}

Nobody an idea?

Accepted Answer

hi,


seems to work fine for me if you remove the NavigationView wrapper on the ScrollView in DetailView1 (at line 44).


it might help debugging this if you first add .navigationBarTitle("Main Level") to the ScrollView in the ContentView, and then also .navigationBarTitle("Level X", displayMode: .inline) in each of ListView1 ("X" = "1"), DetailView1 ("X" = "2"), and DetailView2 ("X" = "3"). then you'll see the problem.


hope that helps,

DMG

But if I remove that, the NavigationLink no longer works.

hi,


this is the code i'm running, using XCode 11.3.1 and with the simulator running iOS 13.3


struct ContentView: View {
  var body: some View {
    NavigationView{
      ScrollView{
        VStack{
          NavigationLink(destination: ListView1()){
            Text("Tap me")
          }
          Text("Nothing here")
        }
      }.navigationBarTitle("Main Level") // added
    }
  }
}


struct ListView1: View {
  var body: some View {
    List{
      NavigationLink(destination: DetailView1()){
        Text("Tap me one more time")
      }
      Text("Item 2")
      Text("Item 3")
    }.navigationBarTitle("Level 2", displayMode: .inline) // added


  }
}


struct DetailView1: View {
  var body: some View {
    // NavigationView{ // remove NavigationView wrapper here
      ScrollView() {
        VStack{
          NavigationLink(destination: DetailView2()){
            Text("Drill down more")
          }
          Text("Nothing here")
        }
      }.navigationBarTitle("Level 3", displayMode: .inline) // added
    // }
  }
}


struct DetailView2: View {
  var body: some View {
    List {
      Text("That's it")
      Text("Nothing here")
    }.navigationBarTitle("Level 4", displayMode: .inline) // added
  }
}


struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}


as far as i can see, this is working fine without two navigation bars (i believe as you intended). uncomment the NavigationView wrapper at lines 34/43 and you have the double navigation bars.


hope that helps,

DMG

Odd, now its working fine here as well. Thanks for the help all!

Two Back headers after NavigationLink
 
 
Q