TabView dengan "PageTabViewStyle" tidak mengupdate kontennya saat @State var berubah

Question

Saya menemukan Masalah aneh di SwiftUI. Saya membuat View sederhana yang hanya menampung Button dan TabView yang menggunakan PageViewStyle. Tampaknya TabView tidak mengupdate kontennya dengan benar bergantung pada Status Variabel. Tampaknya konten diperbarui entah bagaimana tetapi Tampilan tidak akan diperbarui seperti yang saya harapkan

Inilah Kode Pandangan saya:

struct ContentView: View {
    @State var numberOfPages: Int = 0
    @State var selectedIndex = 0
    
    var body: some View {
        VStack {
            Text("Tap Me").onTapGesture(count: 1, perform: {
                self.numberOfPages = [2,5,10,15].randomElement()!
                self.selectedIndex = 0
            })
            
            TabView(selection: $selectedIndex){
                ForEach(0..<numberOfPages, id: \.self) { index in
                    Text("\(index)").background(Color.red)
                }
            }
            .frame(height: 300)
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
        }.background(Color.blue)
    }
}

Beginilah hasil terlihat setelah mengetuk label beberapa kali. Keadaan Awal ada 0 Halaman. Setelah Anda mengetuk, saya berharap konten TabView berubah sehingga semua Halaman akan dapat digulir dan terlihat tetapi hanya indikator halaman yang memperbaruinya. Status untuk beberapa alasan.

Answer 1

TabViewmengharapkan untuk memiliki wadah halaman, tetapi Anda memasukkan hanya satu HStack(dengan konten dinamis sendiri), terlebih lagi merangkai jumlah halaman Anda harus mengatur ulang tampilan tab, jadi inilah perbaikannya.

Diuji dengan Xcode 12 / iOS 14

struct ContentView: View {
    @State var numberOfPages: Int = 0

    var body: some View {
        VStack {
            Text("Tap Me").onTapGesture(count: 1, perform: {
                self.numberOfPages = [2,5,10,15].randomElement()!
            })
            if self.numberOfPages != 0 {
                TabView {
                    ForEach(0..<numberOfPages, id: \.self) { index in
                        Text("\(index)").frame(width: 300).background(Color.red)
                    }
                }
                .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
                .frame(height: 300)
                .id(numberOfPages)
            }
        }
    }
}