我考虑是否有可能在SwiftUI中向TabView添加更多视图,然后有TabItems的位置。
我已经做了类似的事情:
TabView(selection: $selectedTab) {
Text("Hello World 1")
.tabItem {
Image(systemName: "1.circle")
Text("Item 1")
}.tag(0)
Text("Hello World 2")
.tabItem {
Image(systemName: "2.circle")
Text("Item 2")
}.tag(1)
Text("Hello World 3")
.tabItem {
Image(systemName: "3.circle")
Text("Item 3")
}.tag(2)
Text("Hello World 4")
.tabItem {
Image(systemName: "4.circle")
Text("Item 4")
}.tag(3)
Text("Hello World 5")
.tabItem {
Image(systemName: "5.circle")
Text("")
}.tag(4)
Text("Hello World 5")
.tabItem {
Image(systemName: "6.circle")
Text("")
}.tag(5)
}
并自动显示“更多3点”按钮。但是我不希望仅在前4或5个项目中在选项卡栏中显示此其他选项卡项目,而其他项目将仅以编程方式进行导航。我想通过添加按钮的“汉堡菜单”来切换其他视图。
我知道汉堡包/导航抽屉/侧边菜单不是苹果推荐的,但是这种设计非常适合我的应用程序要求。 :)
答案 0 :(得分:0)
我希望以下方法会有用。这个想法是要有动态范围,根据当前选择的选项卡显示标签项。
对于此演示选择,包括可见选项卡的更改取决于预览/下一个按钮,但这并不重要-选择项可能有所不同,仅需要根据所选选项卡更新可见选项卡的范围。就是这样。
演示内容如下:
import SwiftUI
struct TestTabMultiViews: View {
static let maxTabs = 8
@State var selectedTab = 2
@State var visibleTabs = [0, 1, 2, 3]
var body: some View {
VStack {
self.selectorView
Divider()
TabView(selection: $selectedTab) {
ForEach(visibleTabs, id: \.self) { i in
self.viewForTab(i)
.tabItem {
Image(systemName: "\(i).circle")
Text("Item \(i)")
}.tag(i)
}
}
}
}
var selectorView: some View {
HStack {
Button(action: {
let prev = self.selectedTab - 1
if prev >= 0 {
if prev < self.visibleTabs.min()! {
self.visibleTabs = self.visibleTabs.map { $0 - 1 }
}
self.selectedTab = prev
}
}) {
Text("< Prev").padding([.top, .horizontal])
}.disabled(self.selectedTab == 0)
Button(action: {
let next = self.selectedTab + 1
if next < Self.maxTabs {
if next > self.visibleTabs.max()! {
self.visibleTabs = self.visibleTabs.map { $0 + 1 }
}
self.selectedTab = next
}
}) {
Text("Next >").padding([.top, .horizontal])
}.disabled(self.selectedTab == Self.maxTabs - 1)
}
}
private func viewForTab(_ tag: Int) -> some View {
// Provide your view for requested tab tag
Text("Hello World \(tag)")
}
}
struct TestTabMultiViews_Previews: PreviewProvider {
static var previews: some View {
TestTabMultiViews()
}
}