Extra UITabBarButton added to UITabBar

Question

Created Apr ’21

Replies 4

Boosts 1

Views 2.3k

Participants 3

Hello,
I have a strange bug.
An extra tab bar button appears in the lower left corner of the tab bar; it has a label but no image. It duplicates the second tab bar button.
There is an identical issue in stack overflow, but none of the suggestions there apply to my case; but you can look at the image there to see what happens.

https://stackoverflow.com/questions/45757172/uitabbar-item-title-repeated-in-the-bottom-left-corner-visual-bug

To give you more details:

this app has a storyboard with a UITabBarController subclass at its root. This subclass does nothing, except managing some global notification. No subclassing of uitabbar.
The tab bar controller has 4 items
All items are UINavigation controllers, whose root are different controllers
items 1 and 3 are pure UIKit, so we have a navigation controller and then some UIViewController subclasses
items 2 and 4 have a UINavigationController with a UIHostingController inside, and of course then it's SwiftUI

To reproduce the bug I need to:

select items 2 or 4, which contain List elements
select a list item (NavigationLink) => a detail controller opens
navigate back from the detail controller

I have checked with debug view heirarchy and logs, I have verified that when I do these operations an extra UIBarButtonItem gets added.

Quite interestingly, if I do this on item 2 and then on item 4 I get two extra UIBarBUttons; but if I repeat the operation over and over again I don't get anything more. So ax extra button gets added once for each operation on items 2 and 4.

It looks like some weird interaction between UINavigationController, UITabBarController and SwiftUI views. Or maybe an iOs bug, who knows.

I have implemented a hackish way to traverse the hierarchy and remove the extra views, but I would like to remove the bug at its root.

Do you have any suggestion?

Boost

Answer 1

Claude31 OP

Apr ’21

Which version of Xcode ?
That was supposed to be solved in 11.2:

"Fixed an issue with UITabBarController where decoding an instance from a storyboard would create extra views at the left end of the screen. If you worked around this issue on Xcode 11.0 or 11.1 by creating a subclass of UITabBarController and hiding extra views in the initializer you can remove the workaround. (55310448)"

0

Answer 2

nuutsss OP

Apr ’21

I am using Version 12.4 (12D4e)

I guess it is a regression from Apple...

0

Answer 3

pmusolino OP

Apr ’21

I've encountered the same issue. More info here: https://github.com/woocommerce/woocommerce-ios/issues/3995

0

Answer 4

nuutsss OP

May ’21

I have found an effective workaround. It's hackish, but hopefully it's just temporary.
The tab bar children VC send a notification that triggers a manual cleanup of the tab bar, calling this function on the root VC.

Code Block  @objc func cleanupBuggyTabBar() {
        let numberOfTabs = 4
        if tabBar.subviews.count > (numberOfTabs + 1) {
            for index in (numberOfTabs + 1)..<tabBar.subviews.count {
               let view = tabBar.subviews[index]
               view.removeFromSuperview()
            }
        }
    }

I don't like having to traverse the views hierarchy, but at least the UX is smooth.
In some instances I have to trigger this function with a minimal delay (0.01 seconds), which I apply to the notification post.
Again, not very clean but effective.

0