iPadOS 15 UITabBar title cut off

Question

Since I upgraded my iPad operating system, the title of the UITabBar of my app is showing truncated, as shown in the screenshot.

I have tried some methods, but I have not found the correct solution.

Hope someone can help me.

And Here is code:

func setupTabBar() {
    if #available(iOS 13, *) {
        let appearance = tabBar.standardAppearance
        appearance.configureWithOpaqueBackground()
        appearance.backgroundImage = UIImage(color: .white)
        appearance.shadowImage = UIImage(color: .clear)
        let normalAttrs: [NSAttributedString.Key: Any] = [.foregroundColor: ThemeColor.gray]
        let selectedAttrs: [NSAttributedString.Key: Any] = [.foregroundColor: ThemeColor.red]
        appearance.stackedLayoutAppearance.selected.titleTextAttributes = selectedAttrs
        appearance.stackedLayoutAppearance.normal.titleTextAttributes = normalAttrs
        appearance.inlineLayoutAppearance.selected.titleTextAttributes = selectedAttrs
        appearance.inlineLayoutAppearance.normal.titleTextAttributes = normalAttrs
        appearance.compactInlineLayoutAppearance.selected.titleTextAttributes = selectedAttrs
        appearance.compactInlineLayoutAppearance.normal.titleTextAttributes = normalAttrs
        UITabBar.appearance().standardAppearance = appearance
    } else {
        tabBar.backgroundImage = UIImage(color: .white)
        tabBar.shadowImage = UIImage(color: .clear)
    }

    if #available(iOS 15, *) {
        UITabBar.appearance().scrollEdgeAppearance = UITabBar.appearance().standardAppearance
    }
}

score 29 · Accepted Answer · answered Oct 05 '21 at 21:14

29

For some reason, it seems that setting the titleTextAttributes is what causes the problem to happen with inlineLayoutAppearance, and including the default paragraph style of NSParagraphStyle.default fixes it.

For your code, the following changes should fix it (as of iOS 15.0).

let normalAttrs: [NSAttributedString.Key: Any] = [.foregroundColor: ThemeColor.gray, .paragraphStyle: NSParagraphStyle.default]
let selectedAttrs: [NSAttributedString.Key: Any] = [.foregroundColor: ThemeColor.red, .paragraphStyle: NSParagraphStyle.default]

answered Oct 05 '21 at 21:14

Ganter

306
4
4

2

thank you! Saved my life! (iPad app on iOS 15) – Mattia Ducci Nov 16 '21 at 10:03
8

This didn't entirely fix it for me. Setting the default paragraph style stops the ellipsis being added but the text is still getting clipped as if the label frame is not large enough. This is using a custom font on an iPhone app on iOS 15. – Adam Swinden Feb 24 '22 at 11:47

score 0 · Answer 2 · answered Jan 19 '22 at 20:13

For those that cannot have a default paragraph style, setting the attributes for most States got the OS to size the labels correctly for me.

Swift 5.0:

    UITabBarItem.appearance()
        .setTitleTextAttributes(
            customAttributesWithCustomParagraphStyle,
            for: [
                .normal,
                .highlighted,
                .disabled,
                .selected,
                .focused,
                .application,
            ]
        )

Without setting it for at least .normal and .selected, the UITabBarItem title gets truncated when used with custom attributes.

score 0 · Answer 3 · edited May 31 '23 at 16:02

I spent another hour today struggling with this issue. It seems that the custom font caused the problems for me:

NSDictionary *attributesForNomalState = @{
    NSFontAttributeName: [UIFont fontWithName:@"HelveticaNeue" size:UIFont.systemFontSize],
    NSForegroundColorAttributeName: [self colorForName:tabBarItemColor]
};

But, I noticed that it works properly if I assign a constant string like this:

tabItem.title = @"Test1";

However, when I use the Localized string, the title is truncated! Also it works for me if I append a space to the localized string using stringWithFormat function. Crazy. If somebody knows why this urgly workaround works, I would be interested in your comment!

iPadOS 15 UITabBar title cut off

3 Answers3

Linked