【问题标题】:SwiftUI: Can I add more Views to TabView then Tab Items?SwiftUI:我可以向 TabView 添加更多视图,然后是选项卡项吗?
【发布时间】:2019-11-21 18:54:00
【问题描述】:

我考虑是否有可能在 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 个项目,而其他项目将仅以编程方式导航。我想这样做,然后添加带有按钮的汉堡菜单,这些按钮将切换其他视图。

我知道汉堡包/导航抽屉/侧边菜单不是苹果推荐的,但这样的设计非常适合我的应用程序要求。 :)

【问题讨论】:

    标签: swiftui tabview hamburger-menu


    【解决方案1】:

    我希望以下方法有用。这个想法是有一个动态范围,它根据当前选择的选项显示选项卡项。

    对于此演示选择,包括可见选项卡,根据预览/下一步按钮进行更改,但这并不重要 - 选择可能不同,它只需要根据所选选项卡更新可见选项卡的范围。就是这样。

    演示的行为如下:

    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()
        }
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-07-12
      • 2021-07-05
      • 1970-01-01
      • 2020-12-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-09-13
      相关资源
      最近更新 更多