When I try to make a tab bar in swift I get a weird looking tab bar Tab Bar

I don't even have a loop so how can I be showing 3 home items? my code for my tab bar

MainView.swift

import SwiftUI

struct MainView: View {
    var body: some View {
        TabView {
            HomeView()
                .tabItem {
                    Label("Home", systemImage: "house")
                }
            Search()
                .tabItem {
                    Label("Search", systemImage: "magnifyingglass")
                    
                }
            AddItemsView()
                .tabItem {
                    Label("Add Items", systemImage: "plus")
                }
            AccountView()
                .tabItem {
                    Label("Account", systemImage: "person.circle")
                }
            DetailView()
                .tabItem {
                    Label("Test", systemImage: "square")
                }
            

            
        }
    }
}

I show the MainView here -

if viewModel.signedIn{
    VStack{
        MainView()
    }
}

ANY Help is Appreciated

CodePudding user response：

try:

TabView {
        HomeView()
            .tabItem {
                Label("Home", systemImage: "house")
            }
           .tag(0)
        Search()
            .tabItem {
                Label("Search", systemImage: "magnifyingglass")
                
            }
            .tag(1)
        AddItemsView()
            .tabItem {
                Label("Add Items", systemImage: "plus")
            }
            .tag(2)
        AccountView()
            .tabItem {
                Label("Account", systemImage: "person.circle")
            }
            .tag(3)
        DetailView()
            .tabItem {
                Label("Test", systemImage: "square")
            }
            .tag(4)
     }

They need to be uniquely identifiable hence the tag items.

CodePudding user response：

This is a full code with no glitch and a login:

import SwiftUI

struct ContentView: View {
    @State var showLoginView: Bool = false

        var body: some View {
            VStack {
                if showLoginView {
                    MainView()
                } else {
                    Button("Login") {
                        self.showLoginView = true
                    }
                }
            }
        }
}

struct MainView: View {
    var body: some View {
            TabView {
                HomeView()
                    .tabItem {
                        Label("Home", systemImage: "house")
                    }
                Search()
                    .tabItem {
                        Label("Search", systemImage: "magnifyingglass")
                        
                    }
                AddItemsView()
                    .tabItem {
                        Label("Add Items", systemImage: "plus")
                    }
                AccountView()
                    .tabItem {
                        Label("Account", systemImage: "person.circle")
                    }
                DetailView()
                    .tabItem {
                        Label("Test", systemImage: "square")
                    }
                

                
            }
        }
    
}
    
struct HomeView: View {
    var body: some View {
        Color.blue
            .edgesIgnoringSafeArea(.top)
    }
}
struct Search: View {
    var body: some View {
        ZStack {
            Color.red
                .edgesIgnoringSafeArea(.top)
        }
    }
}

struct AddItemsView: View {
    var body: some View {
        Color.yellow
            .edgesIgnoringSafeArea(.top)
    }
}
struct AccountView: View {
    var body: some View {
        Color.purple
            .edgesIgnoringSafeArea(.top)
    }
}

struct DetailView: View {
    var body: some View {
        ZStack {
            Color.red
                .edgesIgnoringSafeArea(.top)
        }
    }
}


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