【问题标题】:How to replace the current view in SwiftUI?如何替换 SwiftUI 中的当前视图?
【发布时间】:2020-12-02 15:38:16
【问题描述】:

我正在使用 SwiftUI 开发应用程序。

我有一个 NavigationView,并且导航栏上有按钮。我想用另一个视图替换当前视图(这是 TabView 选择的结果)。

基本上,当用户单击“编辑”按钮时,我想用另一个视图替换视图以进行编辑,当用户完成后,通过单击“完成”按钮恢复以前的视图。

我可以只使用一个变量来动态选择在当前选项卡视图上显示哪个视图,但我觉得这不是 SwiftUI 中的“正确做法”。这样我就无法应用任何过渡视觉效果。

一些代码示例来解释我在寻找什么。

private extension ContentView {
    @ViewBuilder
    var navigationBarLeadingItems: some View {
        if tabSelection == 3 {
            Button(action: {
                print("Edit pressed")
                // Here I want to replace the tabSelection 3 view by another view temporarly and update the navigation bar items
                }) {
                    Text("Edit")
            }
        }
    }
}

struct ContentView: View {    

    var body: some View {
        NavigationView {
            TabView(selection: $tabSelection) {
                ContactPage()
                    .tabItem {
                        Text("1")
                    }
                    .tag(1)
                Text("Chats")
                    .tabItem() {
                        Text("2")
                    }
                    .tag(2)
                SettingsView()
                    .tabItem {
                        Text("3")
                    }
                    .tag(3)
            }.navigationBarItems(leading: navigationBarLeadingItems)
        }
    }
}

谢谢

编辑

我有一个工作版本,我只需在按钮操作中更新一个切换变量,使我的视图显示一件或另一件事,它正在工作,但我无法对其应用任何动画效果,而且它看起来不“正确” " 在 SwiftUI 中,我想有更好的东西我不知道。

【问题讨论】:

    标签: ios swift swiftui swiftui-navigationview swiftui-tabview


    【解决方案1】:

    如果你只是想添加动画你可以试试:

    struct ContentView: View {
        ...
        @State var showEditView = false
    
        var body: some View {
            NavigationView {
                TabView(selection: $tabSelection) {
                    ...
                    view3
                        .tabItem {
                            Text("3")
                        }
                        .tag(3)
                }
                .navigationBarItems(leading: navigationBarLeadingItems)
            }
        }
    }
    
    private extension ContentView {
        var view3: some View {
            VStack {
                if showEditView {
                    FormView()
                        .background(Color.red)
                        .transition(.slide)
                } else {
                    Text("View 3")
                        .background(Color.blue)
                        .transition(.slide)
                }
            }
        }
    }
    
    struct FormView: View {
        var body: some View {
            Form {
                Text("test")
            }
        }
    }
    

    一种可能的替代方法是使用 ViewRouterHow To Navigate Between Views In SwiftUI By Using An @EnvironmentObject

    【讨论】:

    • 谢谢。我尝试将 .transition(.slide) 应用于 Form { } 块,该块仅在 showEditView 为真时显示,但它似乎不起作用。没有动画效果。我尝试将 .transition 应用于表单的每个子项,但结果是一样的。
    • @BountyHunter 我更新了我的代码,显示了一个新的表单。我可以看到过渡动画(Xcode 11.6、iOS 13.6)。
    • 您可能还需要将 .animation(.default) 添加到要设置动画的部分(在本例中为 TabView 或 NavigationView)
    • var settingsview: some View { VStack { DisplayProfile(contact: self_info) .padding(.top) Spacer() if settingsEdit { Text("Hello1").transition(.slide) } else { Text("Hello2").transition(.slide) } } } 我像你一样设置了一切,但这是一个奇怪的行为:当我不点击“编辑”时:i.imgur.com/0WcY8ZM.png(这是正常的)但是当我点击时:@ 987654323@(也没有过渡动画)
    • 更新:我得到了它的工作,它并不完美,但现在就可以了。我上面截图的问题是因为我使用了 .transition(.slide) 没有 .animation(.default) 这使得文本在没有完成动画的情况下复制......
    猜你喜欢
    • 2022-08-23
    • 2011-04-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-05-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多