首页 > 解决方案 > 导航链接从侧面菜单推送时弹出主视图

问题描述

我正在使用带有侧面菜单的导航链接。

从下面的 gif 中我们可以看到,当用户被推送到内部视图并打开菜单时,它会自动弹出到根视图,然后将其推送到配置文件视图。我期待它从内部视图本身推动。

我按照本教程创建了一个导航侧菜单。

导航链接问题

这是我的代码。我已经创建了这个导航模型AppNavigationViewModel,我已经将它传递给内部视图以便于访问,因为可以有 n 个内部视图。

class AppNavigationViewModel:ObservableObject {
    @Published var shouldPushToContentView:Bool = false
    @Published var showMenu:Bool = false
}

struct ContentView: View {
    
    @StateObject private var navigationModel:AppNavigationViewModel = AppNavigationViewModel()
    
    var body: some View {
        GeometryReader { geometry in
            ZStack(alignment: .leading) {
                NavigationView {
                    VStack {
                        NavigationLink(
                            destination: ProfileView(),
                            isActive: self.$navigationModel.shouldPushToContentView,
                            label: {
                                EmptyView()
                            })
                        MainView()
                            .frame(width: geometry.size.width, height: geometry.size.height)
                    }
                }
                if self.navigationModel.showMenu {
                    MenuView()
                        .frame(width: geometry.size.width/2)
                        .transition(.move(edge: .leading))
                }
            }
        }.environmentObject(self.navigationModel)
    }
}

struct MainView: View {
    
    @EnvironmentObject private var navigationModel:AppNavigationViewModel
    
    var body: some View {
        NavigationLink(
            destination: InnerMainView(),
            label: {
                Text("Push to subview")
            }
        )
        .navigationBarTitle("Root Menu", displayMode: .inline)
        .navigationBarItems(trailing: (
            Button(action: {
                withAnimation {
                    self.navigationModel.showMenu.toggle()
                }
            }) {
                Image(systemName: "line.horizontal.3")
                    .imageScale(.large)
            }
        ))
    }
}

struct MenuView: View {
    @EnvironmentObject private var navigationModel:AppNavigationViewModel
    var body: some View {
        VStack(alignment: .leading) {
            Button(action: {
                self.navigationModel.showMenu = false
                self.navigationModel.shouldPushToContentView = true
            }, label: {
                HStack {
                    Image(systemName: "person")
                        .foregroundColor(.gray)
                        .imageScale(.large)
                    Text("Profile")
                        .foregroundColor(.gray)
                        .font(.headline)
                }
            })
            .padding(.top, 100)
            Spacer()
        }
        .padding()
        .frame(maxWidth: .infinity, alignment: .leading)
        .background(Color(red: 32/255, green: 32/255, blue: 32/255).opacity(0.9))
        .edgesIgnoringSafeArea(.all)
    }
}

struct InnerMainView: View {
    
    @EnvironmentObject private var navigationModel:AppNavigationViewModel
    
    var body: some View {
        Button(action: {
            withAnimation {
                self.navigationModel.showMenu.toggle()
            }
        }) {
            Text("Show Menu From Inner Main View")
        }
        .navigationBarTitle("Inner View", displayMode: .inline)
        .navigationBarItems(trailing: (
            Button(action: {
                withAnimation {
                    self.navigationModel.showMenu.toggle()
                }
            }) {
                Image(systemName: "line.horizontal.3")
                    .imageScale(.large)
            }
        ))
    }
}

struct ProfileView: View {
    
    @EnvironmentObject private var navigationModel:AppNavigationViewModel
    
    var body: some View {
        Button(action: {
            withAnimation {
                self.navigationModel.showMenu.toggle()
            }
        }) {
            Text("Profile View")
        }
        .navigationBarTitle("Profile View", displayMode: .inline)
        .navigationBarItems(trailing: (
            Button(action: {
                withAnimation {
                    self.navigationModel.showMenu.toggle()
                }
            }) {
                Image(systemName: "line.horizontal.3")
                    .imageScale(.large)
            }
        ))
    }
}

标签: swiftxcodeswiftuiswiftui-navigationlinkswiftui-navigationview

解决方案


推荐阅读