Search code examples
swiftuitabviewswiftui-tabview

SwiftUI TabView repeats first entry


Xcode RC 14.1

enter image description here

The first tab is generated twice. The first one works, the second brings up a blank screen. This has been reported elsewhere on SO and people suggest removing Spacer()s but this made no difference.

The code below has two variants, one with a enum for the tag as opposed to an integer but they both misbehave identically. (Not sure why all the code hasn't ended up grey below?)

import SwiftUI


struct MenuView: View {
    
    private enum Tab: Hashable {
            case location
            case calculate
            case install
            case results
            case about
    }
    
    //  @State private var tabBarSelected: Tab = .location
    @State private var selectedTab = 0
    
    var body: some View {
        VStack {
            TabView(selection: $selectedTab) {
                LocationView()
                  //  .tag(Tab.location)
                    .tag(0)
                    .tabItem {
                        Text("Location")
                        Image(systemName: "globe.europe.africa")
                    }
                CalculateView()
                  //  .tag(Tab.calculate)
                    .tag(1)
                    .tabItem {
                        Text("Calculate")
                        Image(systemName: "apps.ipad")
                    }
                InstallView()
                    // .tag(Tab.install)
                    .tag(2)
                    .tabItem {
                        Text("Install")
                        Image(systemName: "window.ceiling.closed")
                    }
                ResultsView()
                    .tag(3)
                    // .tag(Tab.results)
                    .tabItem {
                        Text("Results")
                        Image(systemName: "sun.max.fill")
                    }
                AboutView()
                    .tag(4)
                  //  .tag(Tab.about)
                    .tabItem {
                        Text("About")
                        Image(systemName: "gear")
                    }
            } // TabView
            .accentColor(.yellow)                                               //Active tab color
            
        }                                                                       // VStack
    }                                                                           // body
    
    init() {
        UITabBar.appearance().barTintColor = UIColor.systemGray //TabBar color
        UITabBar.appearance().unselectedItemTintColor = UIColor.systemGray2
        UITabBar.appearance().isOpaque = false
    }
    
} 


struct MenuView_Previews: PreviewProvider {
    static var previews: some View {
        MenuView()
    }
}

Solution

  • You need to wrap your content in a VStack, kindly check your code in LocationView().

    Instead of this:

    var body: some View {
        Text("Hi")
        Text("welcome")
    }
    

    Use the code below:

    var body: some View {
        VStack {
            Text("Hi")
            Text("welcome")
        }
    }