在侧面菜单中实现按钮

问题描述 投票:0回答:1

有人可以帮我解决这个问题吗?我希望这段代码能够工作,例如当我单击侧面菜单上的“主页”按钮时,它应该将我带到主视图(“这是主视图”)。我尝试过使用演示表,但是,演示表看起来不太现实。点击“主页”按钮后,所有内容都会消失,只有主屏幕会出现侧面菜单。我尝试编写此代码,但是,我无法使主页按钮工作。代码如下:

import SwiftUI
import Foundation
import Combine


struct Home: View {
@State var showMenu = false
    @EnvironmentObject var userSettings: UserSettings
  
    var body: some View {
        
        let drag = DragGesture()
            .onEnded {
                if $0.translation.width < -100 {
                    withAnimation {
                        self.showMenu = false
                    }
                }
            }
        return NavigationView {
            
            GeometryReader {
            geometry in
               
            ZStack(alignment: .leading) {
                MainView(showMenu: self.$showMenu)
                .frame(width: geometry.size.width, height: geometry.size.height)
                .offset(x: self.showMenu ? geometry.size.width/2 : 0)
                .disabled(self.showMenu ? true : false)
                if self.showMenu {
                    MenuView()
                        .frame(width: geometry.size.width/2)
                        .transition(.move(edge: .leading))
                }
    }
            .gesture(drag)
        }
            .navigationBarTitle("Pay Data", displayMode: .inline)
       
            .navigationBarItems(leading: (Button(action: {
                withAnimation {
                    self.showMenu.toggle()
                }
            }){
                Image(systemName: "line.horizontal.3")
                    .imageScale(.large)
                
            }
                                         ))
    }
    }
}
struct MainView: View {
    @Binding var showMenu: Bool
        @EnvironmentObject var userSettings: UserSettings
    var body: some View {
        Text("This is Main View")
        
    }
}

struct Home_Previews: PreviewProvider {
    static var previews: some View {
        Home()
            .environmentObject(UserSettings())
       
    }
}

//这是菜单视图。主页按钮位于此视图中。

import SwiftUI
import Combine
import Foundation


struct MenuView: View {
    @EnvironmentObject var userSettings: UserSettings
    @State var showMenu = false
    @State var Homevariable = false
    var body: some View {
        VStack(alignment: .leading) {
            
            Button(action: {
            
                UserDefaults.standard.set(false, forKey: "status")
                
               
            }) {
                (Text(Image(systemName: "rectangle.righthalf.inset.fill.arrow.right")) + (Text("Home")))
            }
              
           
        }
        .padding()
        .frame(maxWidth: .infinity, alignment: .leading)
        .background(Color(red: 32/255, green: 32/255, blue: 32/255))
        .edgesIgnoringSafeArea(.all)
    }
 
}
struct MenuView_Previews: PreviewProvider {
    static var previews: some View {
        MenuView()
            .environmentObject(UserSettings())
       
    }
}

//这是另一种观点。我希望侧面菜单也出现在此处,因此当我按主页按钮时,它会将我带到主视图(“这是主视图”)

import SwiftUI

struct Calculation: View {
    var body: some View {
        Text("Hello, World!")
    }
}

struct Calculation_Previews: PreviewProvider {
    static var previews: some View {
        Calculation()
    }
}
swift xcode swiftui
1个回答
0
投票

给你。您基本上是在重建导航逻辑,因此在 MainView 中,您必须在屏幕之间切换并将侧面菜单放在上面:
(PS:没有GeometryReader也可以)

struct ContentView: View {
    
    @State private var showMenu = false
    @State private var selected: SelectedScreen = .home
    
    var body: some View {
        
        NavigationView {
            ZStack {
                // show selected screen
                switch selected {
                case .home:
                    MainView()
                        .disabled(self.showMenu ? true : false)
                case .screen1:
                    OtherView(screen: 1)

                case .screen2:
                    OtherView(screen: 2)
                }
                
                // put menu over it
                if self.showMenu {
                    MenuView(showMenu: $showMenu, selected: $selected)
                        .transition(.move(edge: .leading))
                }
            }
            .navigationBarTitle("Pay Data", displayMode: .inline)
            
            // .navigationBarItems is deprecated, use .toolbar
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button {
                        withAnimation {
                            self.showMenu.toggle()
                        }
                    } label: {
                        Image(systemName: "line.horizontal.3")
                            .imageScale(.large)
                    }
                }
            }
        }
    }
}


enum SelectedScreen {
    case home
    case screen1
    case screen2
}


struct MenuView: View {
    
    @Binding var showMenu: Bool
    @Binding var selected: SelectedScreen
    
    var body: some View {
        HStack {
        VStack(alignment: .leading, spacing: 24) {
            Button {
                selected = .home
                showMenu = false
            } label: {
                Label("Home", systemImage: "rectangle.righthalf.inset.fill.arrow.right")
            }
            
            Button {
                selected = .screen1
                showMenu = false
           } label: {
                Label("Screen 1", systemImage: "1.circle")
            }
 
            Button {
                selected = .screen2
                showMenu = false
            } label: {
                Label("Screen 2", systemImage: "2.circle")
            }
        }
        .padding()
        .frame(maxHeight: .infinity)
        .background(Color(red: 32/255, green: 32/255, blue: 32/255))
            
            Spacer()
    }
    }
}

struct MainView: View {
    var body: some View {
        Text("This is Main View")
            .font(.largeTitle)
    }
}

struct OtherView: View {
    let screen: Int
    var body: some View {
        Text("Other View: Screen \(screen)")
            .font(.largeTitle)
    }
}
© www.soinside.com 2019 - 2024. All rights reserved.