SwiftUI TabView Updating Selection Does Not Update Selected Tab

Question

For some reason updating the selection does not update the selected tab in this very simple example. My expectation would be that it would show Tab 1 initially, and when I press the Toggle Tab button, it should slide over to Tab 0. Instead I have to toggle the tab 3 times before it finally slides to Tab 0.

Tested in iOS 16

struct Test: View {
    @State var currentTab = 1
    var body: some View {
        VStack {
            Text("Current Tab: \(currentTab)")
            TabView(selection: $currentTab) {
                Text("Tab 0")
                    .tag(0)
                Text("Tab 1")
                    .tag(1)
            }
            .tabViewStyle(.page(indexDisplayMode: .never))
            Button {
                withAnimation(Animation.easeIn(duration: 0.2)) {
                    if currentTab == 0 {
                        currentTab = 1
                    } else {
                        currentTab = 0
                    }
                }
            } label: {
                Text("Toggle Tab")
            }
        }
    }
}

score 5 · Accepted Answer · answered Dec 23 '22 at 16:22

Oh boy. There seem to be bugs specifically around when TabView's initial selection is the second available tag and your first programmatic change to the selection value is to go down to the first tag. I say this because I've tried this with an Int range of 0 to 30 and can reproduce specifically only when attempting to 1) start with an initial selection of 1 and then 2) decrementing to 0. Incrementing to 3 works. Starting at 0 and incrementing works. I feel like I'm missing something weird, but it's also possible that this is simply a bug. I would not be shocked, given that the behavior of TabView is so different when shown as PageTabView, and you don't see a ton of usage of PageTabView-like UI elements that don't start on their first page.

Anyways. As dirty as it is, the only reliable fix I currently have is to simply programmatically toggle down and up in .onAppear. I can think of other ideas for possible workarounds, but for now I felt that posting this is better than leaving you without any feedback.

Note that the placement of .onAppear on a Group around the children is crucial. Place it on the initially-displayed child and it will interfere with later usage because .onAppear is called as the user returns to the initially-displayed child. Place it on the TabView and it seems to be called too early to have the desired hacky impact.

struct Test: View {
    @State var currentTab = 1
    var body: some View {
        VStack {
            Text("Current Tab: \(currentTab)")
            TabView(selection: $currentTab) {
                Group {
                    Text("Tab 0")
                        .tag(0)
                    Text("Tab 1")
                        .tag(1)
                }
                .onAppear {
                    currentTab = 0
                    currentTab = 1
                }
            }

            .tabViewStyle(.page(indexDisplayMode: .never))

            Button {
                withAnimation(Animation.easeIn(duration: 0.2)) {
                    if currentTab == 0 {
                        currentTab = 1
                    } else {
                        currentTab = 0
                    }
                }
            } label: {
                Text("Toggle Tab")
            }
        }
    }
}

I use `PageTabViewStyle` with `UUID` as identifiers. I use it to scroll number of banners using a timer. The issue occurs randomly, not for a specific tab. I don't think your workaround will work for me. I tested it on iOS 15 and works well, the issue only happens with iOS 16. — Mostafa Al Belliehy, Mar 28 '23 at 11:47
yes that Group() was essential. I'd tried all sorts of similar things, but nesting the tabs inside the group did the trick. I found that what was essential was to change the currentTab twice. First to some silly value, and second, to the value you actually want it to be. — PKCLsoft, Jul 09 '23 at 01:12
what bugs me is that we're building apps based on hacks and work arounds for 3+ year old bugs in basic functionality in Apple's flagship UI tools. — PKCLsoft, Jul 09 '23 at 01:13

SwiftUI TabView Updating Selection Does Not Update Selected Tab

1 Answers1