swiftui - 自定义导航栏 SwiftUI 上仅显示后退按钮
问题描述
我在以前的一个视图中有一个 NavigationView。但是,如果我不向该视图添加另一个导航视图,我只会看到一个带有默认 < 返回按钮的导航栏。
当我将导航视图添加到此视图时,我有双导航栏
- 一个带有 < 返回按钮的
- 我创建的一个
找不到解决此问题的方法。
struct MainPageView: View {
@Environment(\.presentationMode) var mode: Binding<PresentationMode>
let screenWidth = screenSize.width
var sections = ["deniz", "kara"]
@State private var sectionIndex = 0
var body: some View {
ZStack {
Color(UIColor(currentSection()))
.edgesIgnoringSafeArea(.all)
ScrollView(.vertical, showsIndicators: false) { ... }
}
.navigationBarTitle("", displayMode: .large)
.navigationBarBackButtonHidden(true)
.navigationBarItems(
leading: HStack{
VStack {
ZStack {
Rectangle()
.fill(Color.clear)
.frame(width: screenWidth / 2, height: 50)
Section {
Picker(
selection: $sectionIndex,
label: Text("Sections")
) {
ForEach(0 ..< sections.count) {
Text(self.sections[$0])
}
}.pickerStyle(SegmentedPickerStyle())
}.padding(.horizontal, 10)
}
Spacer()
}
}
.padding(.leading, screenWidth / 5)
,trailing: HStack {
NavigationSliderItem()
NavigationSearchItem()
}
)
.navigationViewStyle(StackNavigationViewStyle())
如果我在 ZStack 之前插入 NavigationView 会发生这种情况。
导航视图在 Kayit ol 页面上。你可以从视频中看到
解决方案
我想与您分享一个可以解决您所有问题的结构。如果我对您的理解正确,则您有多个导航流程,例如。登录、主页、其他流程。这导致您NavigationView { Navigation View { NavigationView }}}
使用多个后退按钮进行嵌套。
这是一个可能的解决方案,坦率地说,它会在未来对其他项目有更多帮助。
基本视图模型
这个视图模型是用来控制一个Base View
本质上是一个导航控制视图。
class BaseViewModel: ObservableObject {
@Published var userFlow: UserFlow = .loading
init(){
//You might check for login state here
//IF logged in, then go to home, otherwise
//go back to login.
userFlow = .home
}
enum UserFlow {
case loading, onboarding, login, home
}
}
基础视图
这BaseView
将在BaseViewModel
环境对象更改时更新。它是绑定的,所以当它改变时,用户流也会改变。这将允许您在每个流的基础上拥有多个导航堆栈。换句话说,为登录创建一个流程,为登录创建另一个流程,以及为您需要的任何其他流程,导航视图将不再相互干扰。
struct BaseView: View {
//We use an @EnvironmentObject here because later on
//in the app we access this and change the state
//so that the BaseView updates it's flow.
@EnvironmentObject var appState: BaseViewModel
var body: some View {
//Make sure to group, or it won't work properly.
Group {
switch appState.userFlow {
case .onboarding:
Text("Not Yet Implemented")
case .login:
LandingPageView()
case .home:
BaseHomeScreenView().environmentObject(BaseHomeScreenViewModel())
case .loading:
LoadingView()
}
}
.edgesIgnoringSafeArea(.bottom)
.transition(.opacity)
.animation(.spring())
}
}
用法
只需抓取创建的@EnvironmentObject
并设置其值。Swift 将从那里接管并使用switch appState.userFlow
位于BaseView
struct View1: View {
@EnvironmentObject var userFlow: BaseViewModel
var body: some View {
VStack {
Button(action: {userFlow = .login}, label: {
Text("Go to login")
})
}
}
}
请注意,我在没有 IDE 的情况下执行此操作,请原谅任何语法错误。
推荐阅读
- django - 数据不会使用基于分类的视图从 Django 表单提交到数据库
- pip - 在 continuumio/miniconda3:4.9.2 映像上安装 PyICU
- php - 按当前页面从 Curl 处理 XML
- python - 从字典列表中找到最大值
- arrays - 如何处理 Typescript 中的稀疏数组和未定义数组?
- node.js - 如何用猫鼬区分填充的集合
- reactjs - 平板时间不总是与实际时间同步?
- php - 为什么背包演示在文章创建或编辑时崩溃
- javascript - 如何删除javascript中的嵌套属性
- c# - GetValue 在我的附加属性“SelectedItemsHelper”中没有得到任何值