SwiftUI how to keep track of page index in PageTabViewStyle?

Question

I'm trying to keep track of what page the user is on in a TabView that is PageTabViewStyle in SwiftUI but I can't figure out the best way to keep track of the page index? Using .onAppear doesn't work well as it gets called multiple times and pages 2 and 3 get called even when not on the screen. 🤔

@State var pageIndex = 0

    var body: some View {
    VStack {
        Text("current page = \(0) ")
        TabView {
            Text("First")
                .onAppear {
                    pageIndex = 0
                }
            Text("Second")
            .onAppear {
                    pageIndex = 1
                }
            Text("Third")
            .onAppear {
                    pageIndex = 2
                }
        }
         .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
         }
    }
}

Answer 1

You can pass a selection binding to the TabView and use tag to identify the pages:

struct ContentView: View {
    @State var pageIndex = 0
    
    var body: some View {
        VStack {
            Text("current page = \(pageIndex) ")
            TabView(selection: $pageIndex) {
                Text("First").tag(0)
                Text("Second").tag(1)
                Text("Third").tag(2)
            }
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
        }
    }
}

Note that in your original code, it was always going to say current page = 0 because you weren't interpolating the pageIndex variable into the string