如何从滑块菜单在 SwiftUI 中启动新视图,使其不会在滑块本身内启动
How to launch new View in SwiftUI from a slider menu so that it does not launch within the slider itself
所以我正在使用 SwiftUI 并有一个 slider/side 菜单 window。当我启动滑块时,它会出现在屏幕顶部并覆盖大约一半的屏幕宽度。它为用户提供了几个选项。当我单击该菜单上的一个条目时,新视图将显示在半角滑块菜单 window 中。我希望它关闭滑块,然后启动新视图全屏。需要一些帮助。
这是正在运行的滑块...
当我单击其中一个选项时,相应的视图位于滑块 window 内并保持屏幕的一半宽度。我希望滑块缩回并让新 window 启动全屏。
这是一些代码。
struct ContentView : View {
@EnvironmentObject var session: SessionStore
@State var showMenu = false
@State var isDrawerOpen: Bool = falsevar body: some View {
let drag = DragGesture()
.onEnded {
if [=10=].translation.width < -100 {
withAnimation {
self.showMenu = false
}
}
}
return NavigationView {
Group{
GeometryReader { geometry in
ZStack(alignment: .leading) {
// if the user is logged in, then show the mainview.
// if the slider is active, then show the slider on top of mainview
// if the user is not yet logged in then show the login window
if (self.session.session != nil) {
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))
}
} else {
SignInView()
}
}//
.gesture(drag)
}
.navigationBarTitle(...
现在,在我的滑块菜单代码中,您将看到当有人单击按钮时我启动视图的位置。我设置了一个带有 "DrawerContent" 目的地视图的 NavigationLink。当我单击下面 "Players" 的菜单选项时,它会立即启动 DrawerContent 视图,但它卡在滑块菜单内。请参阅下面的屏幕截图...
struct DrawerContent: View {
var body: some View {
//Color.blue
VStack{
Text("hello there")
}
}
}
struct MenuView: View {
@State var showMenu = false
var body: some View {
VStack(alignment: .leading) {
NavigationView{
List {
NavigationLink(destination: DrawerContent()
) {
VStack(alignment: .leading){
Text("Players")
//.font(.system(size: 14))
}
}
这是截图...
我想这是由于在您的 MenuView
中使用了另一个 NavigationView
,如下所示
struct MenuView: View {
@State var showMenu = false
var body: some View {
VStack(alignment: .leading) {
NavigationView{ // <<< this is not needed
只需删除它,它将被用于 NavigationView
来自 ContentView
所以我正在使用 SwiftUI 并有一个 slider/side 菜单 window。当我启动滑块时,它会出现在屏幕顶部并覆盖大约一半的屏幕宽度。它为用户提供了几个选项。当我单击该菜单上的一个条目时,新视图将显示在半角滑块菜单 window 中。我希望它关闭滑块,然后启动新视图全屏。需要一些帮助。
这是正在运行的滑块...
当我单击其中一个选项时,相应的视图位于滑块 window 内并保持屏幕的一半宽度。我希望滑块缩回并让新 window 启动全屏。
这是一些代码。
struct ContentView : View {
@EnvironmentObject var session: SessionStore
@State var showMenu = false
@State var isDrawerOpen: Bool = falsevar body: some View {
let drag = DragGesture()
.onEnded {
if [=10=].translation.width < -100 {
withAnimation {
self.showMenu = false
}
}
}
return NavigationView {
Group{
GeometryReader { geometry in
ZStack(alignment: .leading) {
// if the user is logged in, then show the mainview.
// if the slider is active, then show the slider on top of mainview
// if the user is not yet logged in then show the login window
if (self.session.session != nil) {
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))
}
} else {
SignInView()
}
}//
.gesture(drag)
}
.navigationBarTitle(...
现在,在我的滑块菜单代码中,您将看到当有人单击按钮时我启动视图的位置。我设置了一个带有 "DrawerContent" 目的地视图的 NavigationLink。当我单击下面 "Players" 的菜单选项时,它会立即启动 DrawerContent 视图,但它卡在滑块菜单内。请参阅下面的屏幕截图...
struct DrawerContent: View {
var body: some View {
//Color.blue
VStack{
Text("hello there")
}
}
}
struct MenuView: View {
@State var showMenu = false
var body: some View {
VStack(alignment: .leading) {
NavigationView{
List {
NavigationLink(destination: DrawerContent()
) {
VStack(alignment: .leading){
Text("Players")
//.font(.system(size: 14))
}
}
这是截图...
我想这是由于在您的 MenuView
中使用了另一个 NavigationView
,如下所示
struct MenuView: View {
@State var showMenu = false
var body: some View {
VStack(alignment: .leading) {
NavigationView{ // <<< this is not needed
只需删除它,它将被用于 NavigationView
来自 ContentView