0

In order to adapt to Arabic, I need the view to be displayed from right to left.

But in this case, when tabViewStyle is PageTabViewStyle(indexDisplayMode: .never), and there are more than 3 subpages, Tabview cannot switch pages normally.

I switch between the "View0" button and the "View3" button, the tabview does not follow the switch: enter image description here

Here is a demo where I can reproduce this bug:

import SwiftUI

struct ContentView: View {
    @State var selectedIndex = 0
    var body: some View {
        
        VStack {
            Text("current selected index :\(selectedIndex)")
            SliderView(selectedIndex: $selectedIndex)
            TabView(selection: $selectedIndex) {
                ZStack{
                    Color.red
                    Text("Page0")
                        .foregroundColor(.white)
                }
                .tag(0)
                ZStack{
                    Color.orange
                    Text("Page1")
                        .foregroundColor(.white)
                }
                .tag(1)
                ZStack{
                    Color.blue
                    Text("Page2")
                        .foregroundColor(.white)
                }
                .tag(2)
                ZStack{
                    Color.green
                    Text("Page3")
                        .foregroundColor(.white)
                }
                .tag(3)
            }
        }
        .environment(\.layoutDirection, .rightToLeft)
        .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
    }
}

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

struct SliderView: View {
    @Binding var selectedIndex: Int
    let titles = ["View0", "View1", "View2", "View3"]
    
    var body: some View {
        HStack {
            ForEach(titles.indices, id: \.self) { index in
                Button {
                    selectedIndex = index
                } label: {
                    Text(titles[index])
                        .foregroundColor(selectedIndex == index ? .black : .gray)
                }
                .frame(width: 100)
            }
        }
    }
}

How can I make the Tabview switch correctly?

GorCat
  • 174
  • 3
  • 11

0 Answers0