1

I'm trying to make a simple, 5 tab interface for an iPhone interface in SwiftUI and for some reason, it keeps inserting the view I intended for my tab into the tab bar. So far I have tried embedding the button in a Horizontal stack and a navigation view but neither of these have worked:

This is how it's supposed to appear

But this is how it appears when I try to add the button to the view

Here is the extra tab item

This is my ContentView:

import SwiftUI

struct ContentView: View {
    var body: some View {
        TabView {
            Browse()
                .tabItem {
                    Image(systemName: "photo")
                    Text("Browse")
                }
            Text("Another Tab")
                .tabItem {
                    Image(systemName: "bell")
                    Text("Notifications")
                }
            Text("The Last Tab")
                .tabItem {
                    Image(systemName: "person")
                    Text(Username)
                }
            Text("Another Tab")
                .tabItem {
                    Image(systemName: "magnifyingglass")
                    Text("Search")
                }
            Text("Another Tab")
                .tabItem {
                    Image(systemName: "gearshape")
                    Text("Settings")
                }
        }
        .font(.headline)
    }
}

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

And here is Browse():

import SwiftUI


struct Browse: View {
    var body: some View {
        Button(action: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Action@*/{}/*@END_MENU_TOKEN@*/) {
            Label("Lightning", systemImage: "plus.circle.fill")
                .labelStyle(IconOnlyLabelStyle())
        }
        .navigationTitle(/*@START_MENU_TOKEN@*/"Title"/*@END_MENU_TOKEN@*/)

        
        
        
        
        VStack {
            ScrollView {
                /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Content@*/Text("Placeholder")/*@END_MENU_TOKEN@*/
            }
            
        }
        
        }
    }


struct Browse_Previews: PreviewProvider {
    static var previews: some View {
        Browse()
    }
}

1 Answer 1

1

The problem is happening due to the layout of your Browse View, It looks like SwiftUI Engine is synthesising/inferring two views instead of one. To solve this, give your Browse view a Parent Container View such as a VStack and it will be fixed.

struct Browse: View {
    var body: some View {
        
        VStack {
            Button(action: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Action@*/{}/*@END_MENU_TOKEN@*/) {
                Label("Lightning", systemImage: "plus.circle.fill")
                    .labelStyle(IconOnlyLabelStyle())
            }
            .navigationTitle(/*@START_MENU_TOKEN@*/"Title"/*@END_MENU_TOKEN@*/)
            VStack {
                ScrollView {
                    /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Content@*/Text("Placeholder")/*@END_MENU_TOKEN@*/
                }
                
            }
        }
        
    }
}
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.