Why The Navigation View doesn't show up using SwiftUI? - ios

Question

I have the following files and I don't know why the navigation bar is not showing.
In the first file I am using NavigationView before ContentView().
File 1:
import SwiftUI
#main
struct TwitterCloneApp: App {
var body: some Scene {
WindowGroup {
NavigationView{
ContentView()
}
}
}
}
In second file I am using MainTabView(), but there is no navigation bar space.
File 2
import SwiftUI
struct ContentView: View {
#State private var showMenu = false
var body: some View {
ZStack(alignment: .topLeading){
MainTabView()
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Here it is the MainTabView.
File 3:
import SwiftUI
struct MainTabView: View {
#State private var selectedIndex: Int = 0
var body: some View {
TabView(selection: $selectedIndex){
FeedView()
.onTapGesture {
self.selectedIndex = 0
}
.tabItem{
Image(systemName: "house")
}.tag(0)
ExploreView()
.onTapGesture {
self.selectedIndex = 1
}
.tabItem{
Image(systemName: "magnifyingglass")
}.tag(1)
NotificationsView()
.onTapGesture {
self.selectedIndex = 2
}
.tabItem{
Image(systemName: "bell")
}.tag(2)
MessagesView()
.onTapGesture {
self.selectedIndex = 3
}
.tabItem{
Image(systemName: "envelope")
}.tag(3)
}
}
}
struct MainTabView_Previews: PreviewProvider {
static var previews: some View {
MainTabView()
}
}
There is no space for the navigation bar.

Answer 1

There are several things wrong with the code you've posted:
Each sub-view within a TabView should have its own NavigationView.
There shouldn't be a NavigationView at the top level
Each top-level view within a NavigationView should have a .navigationTitle
The tapGesture isn't needed to switch between tabs
so you should end up with
struct TwitterCloneApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
and
struct MainTabView: View {
#State private var selectedIndex: Int = 0
var body: some View {
TabView(selection: $selectedIndex){
NavigationView {
FeedView()
.navigationTitle("Feed")
}
.tabItem{
Image(systemName: "house")
}.tag(0)
NavigationView {
ExploreView()
.navigationTitle("Explore")
}
.tabItem{
Image(systemName: "magnifyingglass")
}.tag(1)
NavigationView {
NotificationsView()
.navigationTitle("Notifications")
}
.tabItem{
Image(systemName: "bell")
}.tag(2)
NavigationView {
MessagesView()
.navigationTitle("Messages")
}
.tabItem{
Image(systemName: "envelope")
}.tag(3)
}
}
}