SwiftUI 下 TabView 是如何实现的答案

【问题标题】：SwiftUI how TabView is implemented underneathSwiftUI 下 TabView 是如何实现的
【发布时间】：2020-03-20 13:04:17
【问题描述】：

我考虑了 SwiftUI 中的 TabView 是如何实现的。

正如我所见，它仅将带有内容的 @ViewBuilder 接收到初始化程序中。

public init(selection: Binding<SelectionValue>?, @ViewBuilder content: () -> Content)

我想实现我自己的自定义 MyTabView，其用法类似于原生 TabView 的用法。但是考虑一下如何将多个视图（屏幕）传递给内容@ViewBuilder，然后基于这个参数，即闭包返回内容只是有条件地显示它们！基于选择参数。

是否有一些私有实现或有可能以某种方式实现这一点。原始 TabView 有许多我想规避的限制。但同时我想坚持原生实现使用

我想有这样的方法：

MyTabView(selection: $selection, tabs: { 
    Tab1() 
    Tab2() 
    Tab3() 
}) { 
    View1()
    View2()
    View3() 
}

当然最好有这样的东西

MyTabView(selection: $selection}) { 
    View1().tabItem({})
    View2().tabItem()
    View3().tabItem() 
}

但最后一个选项似乎更难实现

【问题讨论】：

您能否再解释一下您对最后一个选项的含义？是否要推断标签栏图像和文本？
是 SwiftUI 使用 TabView 来定义 tabItems。我想在我的自定义 MyTabView 实现中以类似的方式定义此选项卡项

标签： swift swiftui tabview

【解决方案1】：

好的，我有一个简单的版本，它有类似 TabView 的 API。我使用 Preferences 和 TupleView 来实现这一点。

目前未解决的一件事是如何处理组。

这里是github项目链接 https://github.com/michzio/Click5Menu

这里是如何使用它的示例：

 Click5MenuView {


            Page1()
            Page2()
            Page3()

            NavigationView {
                Text("Page 4")
                    .navigationBarTitle("Page 4", displayMode: .inline)
                    .hamburgerButton()
            }
            .menuItem {
               MenuItemView(systemImage: "person", title: "Page 4")
            }
            .withTag(3)

            NavigationView {
                Text("Page 5")
                .navigationBarTitle("Page 5", displayMode: .inline)
                .hamburgerButton()
            }
            .menuItem {
                MenuItemView(systemImage: "person", title: "Page 5")
            }
            .withTag(4)

}

struct Page1 : View {

    var body: some View {

        NavigationView {
            Text("Page 1")
            .navigationBarTitle("Page 1", displayMode: .inline)
            .hamburgerButton()
        }
        .menuItem {
            MenuItemView(systemImage: "person", title: "Page 1")
        }
        .tabBarItem {
            TabItemView(systemImage: "person", title: "Page 1")
        }
        .withTag(0)
    }
}

【讨论】：