0

This is the side menu items and I want to set the view on clicking the items on the side menu.

when I click on the button then my View is set on view on side menu I used NavigationView for trigger screen. I don't understand how to trigger view

struct MenuContentQ: View {
    var body: some View {
        
        
     NavigationView {

             Group {
                 VStack {
                    NavigationLink(destination: {
                        
                        ExploreCategoriesView()
                        
                    }, label: {
                        Button(action: {
                            
                            
                            
                        }, label: {
                            
                            HStack{
                                Image(systemName: "lightbulb.fill")
                                    .font(.title2)
                                    .foregroundColor(.gray)
                                    .padding(.leading)
                                Text("Plan")
                                    .font(.title2)
                                    .foregroundColor(.black)
                                    .padding(.leading,5)
                                Spacer()
                            }
                            .padding(.vertical)
                            
                        })
                        
                    })
                    
                     
                     
                     Button(action: {
                         
                         
                         
                     }, label: {
                         
                         HStack{
                             Image(systemName: "doc.fill")
                                 .font(.title2)
                                 .foregroundColor(.gray)
                                 .padding(.leading)
                             Text("Donate Pdf")
                                 .font(.title2)
                                 .foregroundColor(.black)
                                 .padding(.leading,5)
                             Spacer()
                         }
                         .padding(.vertical)
                         
                         
                     })
                     
                     Button(action: {
                         
                         
                     }, label: {
                         
                         
                         HStack{
                             Image(systemName: "square.split.2x2.fill")
                                 .font(.title2)
                                 .foregroundColor(.gray)
                                 .padding(.leading)
                             Text("Dashboard")
                                 .font(.title2)
                                 .foregroundColor(.black)
                                 .padding(.leading,5)
                             Spacer()
                         }.padding(.vertical)
                         
                         
                     })
                     
                     
                     Button(action: {
                         
                         
                         
                     }, label: {
                         
                         
                         HStack{
                             Image(systemName: "person.crop.square.fill")
                                 .font(.title2)
                                 .foregroundColor(.gray)
                                 .padding(.leading)
                             Text("My Profile")
                                 .font(.title2)
                                 .padding(.leading,5)
                             Spacer()
                         }.padding(.vertical)
                         
                     })
                     
                     
                     
                    Text("My Profile").onTapGesture {
                        print("My Profile")
                    }
                    Text("Posts").onTapGesture {
                        print("Posts")
                    }
                    Text("Logout").onTapGesture {
                        print("Logout")
                    }
                     
                     Spacer()
             }
                 
         }
        }
    }
}

This is Side Menu view where we set the menu drawer.

struct SideMenuQ: View {
    let width: CGFloat
    let isOpen: Bool
    let menuClose: () -> Void
    
    var body: some View {
        ZStack {
            GeometryReader { _ in
                Color.gray.opacity(0.2)
            }
            .background(Color.gray.opacity(0.2))
            .opacity(self.isOpen ? 1.0 : 0.0)
            .animation(Animation.easeIn.delay(0.25))
            .onTapGesture {
                self.menuClose()
            }
            
            HStack {
                MenuContentQ()
                    .frame(width: self.width)
                    .background(Color.white)
                    .offset(x: self.isOpen ? 0 : -self.width)
                    .animation(.default)
                
                Spacer()
            }
        }
    }
}

This the Main View where we set the View by clicking the menu items.

struct ContentView: View {
    @State var menuOpen: Bool = false
    
    var body: some View {
        
        
        VStack {
            ZStack {
                
                if !self.menuOpen {
                    Button(action: {
                        self.openMenu()
                    }, label: {
                        Image(systemName: "line.3.horizontal").foregroundColor(.black)
                    })
                }
                
                SideMenuQ(width: 270,
                         isOpen: self.menuOpen,
                         menuClose: self.openMenu)
   
            }
            Spacer()
        }
        .gesture(DragGesture(minimumDistance: 50).onChanged{ value in
            self.openMenu()
           
          
        }
        .onEnded { value in
            
        })
      
    }
    
    func openMenu() {
        self.menuOpen.toggle()
    }
}

0 Answers0