I am having the following view:

import SwiftUI

struct HiddenTabs: View {
    var body: some View {
        TabView {
            NavigationStack {
                NavigationLink("Tap Me") {
                    Text("Detail View")
                        .toolbar(.hidden, for: .tabBar)
                }
                .padding()
                .background(.secondary)
                .navigationTitle("Primary View")
            }
            .tabItem {
                Label("Home", systemImage: "house")
            }
        }.background(.purple)
    }
}

#Preview {
    HiddenTabs()
}

It works fine, but the tabs appearance after the back button press on navigation view is too late and causes the whole content of the tab to jump up.

Is it possible to make tabs appearance don't cause content jump? Ideally, I don't want any animation besides NavigationStack "< Back".

I am having the following view:

import SwiftUI

struct HiddenTabs: View {
    var body: some View {
        TabView {
            NavigationStack {
                NavigationLink("Tap Me") {
                    Text("Detail View")
                        .toolbar(.hidden, for: .tabBar)
                }
                .padding()
                .background(.secondary)
                .navigationTitle("Primary View")
            }
            .tabItem {
                Label("Home", systemImage: "house")
            }
        }.background(.purple)
    }
}

#Preview {
    HiddenTabs()
}

It works fine, but the tabs appearance after the back button press on navigation view is too late and causes the whole content of the tab to jump up.

Is it possible to make tabs appearance don't cause content jump? Ideally, I don't want any animation besides NavigationStack "< Back".

• ios
• swiftui
• swiftui-tabview
• swiftui-navigationstack

Share Improve this question Follow edited Mar 23 at 12:05 Bogdan Gusiev asked Mar 23 at 10:01 Bogdan GusievBogdan Gusiev 8,3171616 gold badges6262 silver badges8383 bronze badges 2

• See How do I animate hiding and showing tab bar in SwiftUI? – Benzy Neez Commented Mar 23 at 10:06
• @BenzyNeez what if I don't want to animate it? I see other apps behaving with neither animation nor content jump (ex telegram). The solutions proposed in that question are providing better animation, but I don't I really need anything beyond NavigationStack animation. – Bogdan Gusiev Commented Mar 23 at 11:47

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

The post How do I animate hiding and showing tab bar in SwiftUI? explores ways of animating the change in tabbar visibility.

You said in a comment, that you don't need animation. In which case, it may be sufficient to use a state variable to determine the visibility.

I found it works best to update the state variable in separate .onAppear callbacks for the NavigationLink and its destination. If instead you try to reset it in .onDisappear for the destination, there is still a jump.

@State private var toolbarVisibility = Visibility.visible

NavigationStack {
    NavigationLink("Tap Me") {
        Text("Detail View")
            .onAppear { toolbarVisibility = .hidden }
    }
    .padding()
    .background(.secondary)
    .navigationTitle("Primary View")
    .onAppear { toolbarVisibility = .visible }
}
.toolbar(toolbarVisibility, for: .tabBar)
.tabItem {
    Label("Home", systemImage: "house")
}