使用SwiftUI设置TabBar项目徽章计数

是否可以通过SwiftUI显示TabItem徽章?

使用UIKit可以轻松实现,如此处所述->

How to set badge value in Tab bar?

我没有找到使用SwiftUI做到这一点的方法。 唯一可能的方法是使用场景rootViewController访问UITabBarController并直接修改其选项卡栏项目。

  func setBadgeCount(_ count: Int) {
    UIApplication.shared.applicationIconBadgeNumber = count

    guard let delegate = app.connectedScenes.first?.delegate as? SceneDelegate else {
        return
    }

    if let tabBarController = delegate.window?.rootViewController?.children.first {
      tabBarController.viewControllers?.first?.tabBarItem.badgeValue = "\(count)"
    }
  }

有什么想法如何使用本机SwiftUI方法做到这一点?

liuweiwangyujia 回答:使用SwiftUI设置TabBar项目徽章计数

当前,SwiftUI没有徽章功能,因此我们必须自定义。

参考文献HERE我创建了带有徽章的工作服

struct ContentView: View {
    private var badgePosition: CGFloat = 2
    private var tabsCount: CGFloat = 2
    @State var selectedView = 0
    var body: some View {
        GeometryReader { geometry in
            ZStack(alignment: .bottomLeading) {
                TabView {
                    Text("First View")
                        .tabItem {
                            Image(systemName: "list.dash")
                            Text("First")
                        }.tag(0)
                    Text("Second View")
                        .tabItem {
                            Image(systemName: "star")
                            Text("Second")
                        }.tag(1)
                }

                ZStack {
                  Circle()
                    .foregroundColor(.red)

                    Text("3")
                    .foregroundColor(.white)
                    .font(Font.system(size: 12))
                }
                .frame(width: 15,height: 15)
                .offset(x: ( ( 2 * self.badgePosition) - 0.95 ) * ( geometry.size.width / ( 2 * self.tabsCount ) ) + 2,y: -30)
                .opacity(1.0)
            }
        }
    }
}
,
 func calculateBadgeXPos(width: CGFloat) -> CGFloat {
        let t = (2*CGFloat(self.selectedTab))+1
        return CGFloat(t * width/(2*CGFloat(TABS_COUNT)))
    }

然后在这里使用它:

GeometryReader { geometry in
            ZStack(alignment: .bottomLeading) {
                // make sure to update TABS_COUNT
                TabView(selection: self.$selectedTab) {
                   ...
                }
                
                NotificationBadge(...)
                .offset(x: self.calculateBadgeXPos(width: geometry.size.width),y: -28)
            }
        }



Preview上看起来像这样

enter image description here

,

现在在 SwiftUI 3 中,他们添加了 .badge() 修饰符

来源:HackingWithSwift

TabView {
    Text("Your home screen here")
        .tabItem {
            Label("Home",systemImage: "house")
        }
        .badge(5)
}
,
struct ContentView: View {
var body: some View {
    TabView {
        Text("Home")
            .tabItem {
                Text("Home")
            }
        
        Text("Home")
            .tabItem {
                Text("Home")
            }
        
        Text("Home")
            .tabItem {
                Text("Home")
            }
    }
    .introspectTabBarController { (tabbarController) in
        if let items = tabbarController.tabBar.items {
            let tabItem = items[2]
            tabItem.badgeValue = "1"
        }
    }
}

}

本文链接:https://www.f2er.com/2950363.html

大家都在问