I am using the navigation links with the side menu.
As we can see from the below gif when the user is pushed to the inner view and open the menu then it automatically poped to root view and then pushed it to the profile view. I am expecting it to push from the inner view itself.
I followed this tutorial to create a navigation side menu.
Here is my code. I have created this navigation model AppNavigationViewModel
which I have passed to inner views for easy access as there can be n number of inners views.
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)
}
))
}
}