swift - SwiftUI navigationBarItems 在 TabView 中消失
问题描述
我有一个包含导航栏项目的视图,我将该视图嵌入到TabView
. 但是这样做时,栏项目不再出现。如果我在 a 之外调用视图,TabView
一切都会按预期工作。
下面是一个小示例项目来说明我的问题,请注意TabView
最初没有调用,ContentView
但后来调用了:
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView{
NavigationLink(destination: WarehouseOrderTabView()){
Text("Click me")
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct WarehouseOrderTabView: View {
var body: some View {
TabView{
TabView1().navigationBarTitle("Dashboard")
.tabItem {
Image(systemName: "gauge")
Text("Dashboard")
}
TabView2().navigationBarTitle("Orders")
.tabItem {
Image(systemName: "list.dash")
Text("Orders")
}
}
}
}
struct TabView1: View {
var body: some View {
Text("TabView 1")
//I would expect to see those bar items when displaying tab 1
.navigationBarItems(trailing: (
HStack{
Button(action: {
}, label: {
Image(systemName: "arrow.clockwise")
.font(.title)
})
.padding(.init(top: 0, leading: 0, bottom: 0, trailing: 20))
Button(action: {
}, label: {
Image(systemName: "slider.horizontal.3")
.font(.title)
})
}
))
}
}
struct TabView2: View {
var body: some View {
Text("TabView 2")
}
}
我在这里想念什么?
解决方案
ANavigationView
可以嵌入到 a 中TabView
,反之亦然。
TabView
包含不同tabItem()
的(最多 5 个)可以包含您的视图。
这就是你可以使用它的方式。
TabView1.swift
struct TabView1: View {
var body: some View {
NavigationView {
Text("TabView 1")
.navigationBarTitle("Dashboard")
.navigationBarItems(trailing:
HStack {
Button(action: {
// more code here
}) {
Image(systemName: "arrow.clockwise")
.font(.title)
}
Button(action: {
// more code here
}) {
Image(systemName: "slider.horizontal.3")
.font(.title)
}
}
)
}
}
}
TabView2.swift
struct TabView2: View {
var body: some View {
NavigationView {
NavigationLink(destination: YourNewView()) {
Text("TabView 1")
}
.navigationBarTitle("Orders")
}
}
}
内容视图.Swift
import SwiftUI
struct ContentView: View {
var body: some View {
TabView {
TabView1()
.tabItem {
Image(systemName: "gauge")
Text("Dashboard")
}
TabView2()
.tabItem {
Image(systemName: "list.dash")
Text("Orders")
}
}
}
}
希望能帮助到你 :)
推荐阅读
- jquery - 带有引导程序 4 的 Jquery
- asp.net-core - 如何在asp net core web api项目中为每个请求在会话中存储用户ID?
- reactjs - 如何使用在 useEffect 挂钩中定义的 onPress(on click) 调用函数
- angular - 无法通过当前组件路由组件
- java - 缺少所需的请求正文:在弹簧靴和角度 9 中
- javascript - 是否可以在函数中使用道具作为默认值(使用反应/解构分配规则时)
- java - 无法在 Mac 上使用 Chromedriver 运行 Selenium 测试
- postgresql - 无法删除 TypeORM 中的 OneToMany 记录
- excel - Excel 自定义数据验证下拉菜单
- css - 使用 Nuxt js 预加载字体