A页面——>B页面——>C页面——>D页面，然后：D页面——>B页面。
-
效果如下：
1.gif
代码如下：
import SwiftUI
struct ContentViewA: View {
@State var isNavPush = false
var body: some View {
VStack {
HStack {
Spacer()
Text("ContentViewA")
.font(.system(size: 17,weight: .semibold))
Spacer()
}.frame(height: 44)
Spacer()
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
Spacer()
}.fullScreenCover(isPresented: $isNavPush, content: {
ContentViewB()
})
.padding()
}
}
struct ContentViewB: View {
@Environment(\.presentationMode) var presentationMode
// @Binding var rootIsActive : Bool
@State var isNavPush = false
var body: some View {
NavigationView {
VStack {
NavigationLink(isActive: $isNavPush) {
ContentViewC(rootIsActive: $isNavPush)
} label: {
}
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
}.navigationBarTitle("ContentViewB", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
}
struct ContentViewC: View {
@Environment(\.presentationMode) var presentationMode
@Binding var rootIsActive : Bool
@State var isNavPush = false
var body: some View {
VStack {
NavigationLink(isActive: $isNavPush) {
ContentViewD(rootIsActive: $rootIsActive)
} label: {
}
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
}.navigationBarTitle("ContentViewC", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
struct ContentViewD: View {
@Environment(\.presentationMode) var presentationMode
@Binding var rootIsActive : Bool
var body: some View {
VStack {
Button {
self.rootIsActive = false
} label: {
Text("返回根目录")
}
}.navigationBarTitle("ContentViewD", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
A页面——>B页面——>C页面——>D页面，然后：D页面——>A页面。
-
效果如下：
2.gif
代码如下：
import SwiftUI
struct ContentViewA: View {
@State var isNavPush = false
var body: some View {
NavigationView {
VStack {
NavigationLink(isActive: $isNavPush) {
ContentViewB(rootIsActive: $isNavPush)
} label: {
}
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
}.navigationBarTitle("ContentViewA", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.padding()
}
}
}
struct ContentViewB: View {
@Environment(\.presentationMode) var presentationMode
@Binding var rootIsActive : Bool
@State var isNavPush = false
var body: some View {
VStack {
NavigationLink(isActive: $isNavPush) {
ContentViewC(rootIsActive: $rootIsActive)
} label: {
}
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
}.navigationBarTitle("ContentViewB", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
struct ContentViewC: View {
@Environment(\.presentationMode) var presentationMode
@Binding var rootIsActive : Bool
@State var isNavPush = false
var body: some View {
VStack {
NavigationLink(isActive: $isNavPush) {
ContentViewD(rootIsActive: $rootIsActive)
} label: {
}
Button {
isNavPush = true
} label: {
Text("导航跳转")
}
}.navigationBarTitle("ContentViewC", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
struct ContentViewD: View {
@Environment(\.presentationMode) var presentationMode
@Binding var rootIsActive : Bool
var body: some View {
VStack {
Button {
self.rootIsActive = false
} label: {
Text("返回根目录")
}
}.navigationBarTitle("ContentViewD", displayMode: .inline) //设置标题displayMode，默认的是：automatic（大标题）
.navigationBarBackButtonHidden(true) //隐藏系统的导航返回按钮
.navigationBarItems(leading: Button(action: { //自定义导航的返回按钮
presentationMode.wrappedValue.dismiss() //返回上级页面
}, label: {
Image("nav_back_black") //导航返回按钮图标
}))
.padding()
}
}
总结：
1、使用导航跳转，返回到指定页面时，目前还只知道这种方式（实际：都是返回到导航根页面），目前还在SwiftUI的练习阶段，如果有更好的处理方式，还请不吝分享。
2、上文中第二种效果中，如果实现D页面——>B页面也是可以实现的，需要在B页面的VStack{}外套一层NavigationView{}，然后rootIsActive的标记从B页面开始（而非A页面开始），但是会有两个问题：a、跳转到的页面会有两层导航显示。b、从D页面直接返回到B页面后，此时点击B页面的“导航跳转”，则直接跳转到了D页面（正常情况下应该跳转C页面）。
如果有完美解决以上问题的大神，还请分享分享，谢谢！~
