SwiftUI：我可以向 TabView 添加更多视图，然后是选项卡项吗？

Posted 2023-02-24

【中文标题】SwiftUI：我可以向 TabView 添加更多视图，然后是选项卡项吗？

【英文标题】：SwiftUI: Can I add more Views to TabView then Tab Items?

【发布时间】：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 个项目，而其他项目将仅以编程方式导航。我想这样做，然后添加带有按钮的汉堡菜单，这些按钮将切换其他视图。

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

【参考方案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()