ARTICLE AD BOX
Based on the fact that the animation is shown sometimes, I believe this behaviour is unintentional.
One workaround is to remove the switch statement so that both views are alive at the same time, and use opacity to show/hide each tab. This has the additional (and usually desirable) effect of maintaining the view state between switching tabs.
ZStack { Text("Tab 1") .opacity(tab == .tab1 ? 1 : 0) .toolbar { if tab == .tab1 { ToolbarItem(placement: .topBarLeading) { Button("Tab 1 Button", systemImage: "person") { } } } } Text("Tab 2") .opacity(tab == .tab2 ? 1 : 0) .toolbar { if tab == .tab2 { ToolbarItem(placement: .topBarLeading) { Button("Tab 2 Button", systemImage: "plus") { } } ToolbarItem(placement: .topBarLeading) { Button("Tab 2 Button", systemImage: "trash") { } } } } }Alternatively, you can merge the two .toolbar { ... } (and remove them from the Texts) and put it on ZStack instead,
ZStack { // ... } .toolbar { switch tab { case .tab1: ToolbarItem(placement: .topBarLeading) { Button("Tab 1 Button", systemImage: "person") { } } ToolbarItem(placement: .topBarLeading) { Button("Tab 2 Button", systemImage: "plus") { } } case .tab2: ToolbarItem(placement: .topBarLeading) { Button("Tab 2 Button", systemImage: "trash") { } } } }293k23 gold badges262 silver badges442 bronze badges
1 Comment
The second suggestion didn't seem to work. The first suggestion did, but I'll be honest, I'm not sure if I'm a fan of the opacity approach long-term. Once the tabs have interactive content, keeping multiple views stacked can get tricky unless hit-testing and accessibility are handled explicitly.
2026-01-26T04:38:12.913Z+00:00
Explore related questions
See similar questions with these tags.
