Question

我创建了一个简单的集合，通过一个按钮跳转到下一个视图。从最后一个视图应该有一个到 AddItemView 的转换，但它没有发生 - 它返回到第一个屏幕。你能告诉我我哪里做错了吗？将背景图像放置在第一个收藏屏幕上的正确方法是什么，使其不会出现在以下屏幕上？

import SwiftUI

struct AddItemView: View {
    var body: some View {
        Text("Hallo!")
    }
}

struct ContentView: View {
    
    var colors: [Color] = [ .orange, .green, .yellow, .pink, .purple ]
    var emojis: [String] = [ "?", "?", "?" , "?", "?"]
    @State private var tabSelection = 0
    
    var body: some View {
        
        TabView(selection: $tabSelection) {
            
            ForEach(0..<emojis.endIndex) { index in
                VStack {
                    Text(emojis[index])
                        .font(.system(size: 150))
                        .frame(minWidth: 30, maxWidth: .infinity, minHeight: 0, maxHeight: 250)
                        .background(colors[index])
                        .clipShape(RoundedRectangle(cornerRadius: 30))
                        .padding()
                        .tabItem {
                            Text(emojis[index])
                        }
                    Button(action: {
                        self.tabSelection += 1   
                    }) {
                        if tabSelection == emojis.endIndex {
                            NavigationLink(destination: AddItemView()) {
                                Text("Open View")
                            }
                        } else {
                            Text("Change to next tab")
                        }
                    }
                }
            }
        }
        .tabViewStyle(PageTabViewStyle())
        .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
        .tabViewStyle(PageTabViewStyle.init(indexDisplayMode: .never))
    }
}

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

Answer 1

在此代码中，您不必使用 NavigationView。需要导航到下一个屏幕。如果导航控制器存在，则类似于推送视图控制器的概念。此外，删除 endIndex 并使用 indices。

struct ContentView: View {
    
    var colors: [Color] = [ .orange, .green, .yellow, .pink, .purple ]
    var emojis: [String] = [ "?", "?", "?" , "?", "?"]
    @State private var tabSelection = 0
    
    var body: some View {
        NavigationView { //<- add navigation view
            TabView(selection: $tabSelection) {
                
                ForEach(emojis.indices) { index in //<-- use indices
                    VStack {
                        Text(emojis[index])
                            .font(.system(size: 150))
                            .frame(minWidth: 30, maxWidth: .infinity, minHeight: 0, maxHeight: 250)
                            .background(colors[index])
                            .clipShape(RoundedRectangle(cornerRadius: 30))
                            .padding()
                            .tabItem {
                                Text(emojis[index])
                            }
                        Button(action: {
                            self.tabSelection += 1
                        }) {
                            if tabSelection == emojis.count - 1 { //<- use count
                                NavigationLink(destination: AddItemView()) {
                                    Text("Open View")
                                }
                            } else {
                                Text("Change to next tab")
                            }
                        }
                    }
                }
            }
            .tabViewStyle(PageTabViewStyle())
            .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
            .tabViewStyle(PageTabViewStyle.init(indexDisplayMode: .never))
        }
    }
}

如果您已经有上一屏幕的导航链接，那么问题在于您以错误的方式使用了 endIndex。检查此线程是否正确使用 (https://stackoverflow.com/a/36683863/14733292)。

如何在 TabView 中的屏幕之间切换以及从后者切换到另一个 View？

1 个答案: