Member-only story

SwiftUI: Ways to Show Badge on Tab Bar Item

Prafulla Singh
2 min readFeb 15, 2021

--

Xcode 12.4 — iOS 14

Using wrapped TabViewController within TabView

SwiftUI’s TabView is not native SwiftUI component but rather a wrapper on UIKit’s UITabBarController. If can get access to UITabBarController, We can simply use UIKit APIs to set badge.

  1. To get UITabBarController, we can iterate from UIApplication window to rootViewController and subsequent child until we get instance of UITabBarController.
  2. Every time View State change SwiftUI view updates, It also refreshes tab view resulting resetting UIKit’s Badge. So we will also need to set a KVO on TabViewItem so that we can override this reset.

Demo:

Using GeometryReader to paint Badge on top of TabView and Reposition on top-left of TabItem:

--

--

Prafulla Singh
Prafulla Singh

No responses yet