SwiftUI 中似乎不支持 UITabBar。解决方法？

Question

SwiftUI 似乎不支持 UITabBar。我如何整合该功能？

仅仅像（例如）MKMapView 那样包装视图是行不通的，因为它需要与 NavigationView 深度集成。使用 UINavigationView 太不像 SwiftUI 了。

Answer 1

'TabbedView'是最接近的。它可以像下面这样使用：

    struct TabView : View {

        @State private var selection = 1

        var body: some View {
            TabbedView (selection: $selection) {
                InboxList()
                    .tabItemLabel(selection == 1 ? Image("second") : Image("first"))
                    .tag(1)

                PostsList()
                    .tabItemLabel(Image("first"))
                    .tag(2)

                Spacer()
                    .tabItemLabel(Image("first"))
                    .tag(3)

                Spacer()
                    .tabItemLabel(Image("second"))
                    .tag(4)
            }
        }
    }

Answer 2

如果您对 TabbedView 不满意，您可以随时推出自己的产品！这是一个快速的基本实现：

import SwiftUI

struct ContentView : View {

    let tabs = [TabItemView(title: "Home", content: { Text("Home page text") }), TabItemView(title: "Other", content: { Text("Other page text") }), TabItemView(title: "Pictures", content: { Text("Pictures page text") })]

    var body: some View {
        TabBar(tabs: tabs, selectedTab: tabs[0])
    }
}

struct TabItemView<Content> : Identifiable where Content : View {
    var id = UUID()
    var title: String
    var content: Content

    init(title: String, content: () -> Content) {
        self.title = title
        self.content = content()
    }


    var body: _View { content }

    typealias Body = Never
}

struct TabBar<Content>: View where Content : View {
    let tabButtonHeight: Length = 60

    var tabs: [TabItemView<Content>]
    @State var selectedTab: TabItemView<Content>

    var body: some View {
        GeometryReader { geometry in
        VStack(spacing: 0) {
            self.selectedTab.content.frame(width: geometry.size.width, height: geometry.size.height - self.tabButtonHeight)

            Divider()
            HStack(spacing: 0) {
                    ForEach(self.tabs) { tab in
                        Button(action: { self.selectedTab = tab}) {
                            Text(tab.title)
                        }.frame(width: geometry.size.width / CGFloat(Double(self.tabs.count)), height: self.tabButtonHeight)

                    }
                }
                .background(Color.gray.opacity(0.4))
            }
            .frame(width: geometry.size.width, height: geometry.size.height)

        }
    }
}

Answer 3

我在尝试制作 ToolBar 时弄错了问题...下面是我最终得到的代码...感谢大家。

struct ToolBarItem : Identifiable {
    var id = UUID()
    var title : String
    var imageName : String
    var action: () -> Void
}

struct TooledView<Content> : View where Content : View{
    var content :  Content
    var items : [ToolBarItem]
    let divider = Color.black.opacity(0.2)

    init(items : [ToolBarItem], content: () -> Content){
        self.items = items
        self.content = content()
    }
    var body : some View{
        VStack(spacing: 0){
            self.content
            self.divider.frame(height: 1)
            ToolBar(items: self.items).frame(height: ToolBar.Height)
        }
    }
}

struct ToolBar : View{
    static let Height : Length = 60
    var items : [ToolBarItem]
    var body: some View {
        GeometryReader { geometry in
            HStack(spacing: 0){
                ForEach(self.items){ item in
                    Button(action: item.action){
                        Image(systemName: item.imageName).imageScale(.large)
                        Text(item.title).font(.caption)
                    }.frame(width: geometry.size.width / CGFloat(Double(self.items.count)))

                }

            }
                .frame(height: ToolBar.Height)
                .background(Color.gray.opacity(0.10))
        }
    }
}

Answer 4

UITabBar 现在似乎可以在 Xcode 13.3、SwiftUI 3、iOS15+ 上运行即使我没有导入 UIKit 也能正常工作，不确定是否有任何效果，但它对我有用

    struct LandingView: View {
    @Binding var selectedTab: String
    
    //hiding tab bar
    init(selectedTab: Binding<String>) {
        self._selectedTab = selectedTab
        UITabBar.appearance().isHidden = true 
    }
    
    var body: some View {
        //Tab view with tabs
        TabView(selection: $selectedTab) {
            //Views
            Home() 
                .tag("Home")
            PlaylistView()
                .tag("My Playlists")
            HistoryView()
                .tag("History")
            
        }
    }
}

SwiftUI 中似乎不支持 UITabBar。解决方法？

There doesn't appear to be support for UITabBar in SwiftUI. Workarounds?

uitabbar

swiftui