x_z
x_z

Reputation: 478

iPadOS 15 UITabBar title cut off

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
    }
}

enter image description here

Upvotes: 11

Views: 2779

Answers (4)

BytePixelMelody
BytePixelMelody

Reputation: 21

This approach helped me, I used SnapKit to create constraints:

import SnapKit

extension UITabBarController {
    
    open override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
        
        tabBar.subviews.forEach { barButton in
            barButton.subviews.forEach { subview in
                if let label = subview as? UILabel {
                    let intrinsicWidth = label.intrinsicContentSize.width
                    label.snp.makeConstraints {
                        $0.width.equalTo(intrinsicWidth)
                        $0.centerX.equalToSuperview()
                        $0.bottom.equalToSuperview().inset(2)
                    }
                }
            }
        }
    }
    
}

Upvotes: 0

igoMobile
igoMobile

Reputation: 91

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!

Upvotes: 0

BFeher
BFeher

Reputation: 557

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.

Upvotes: 0

Ganter
Ganter

Reputation: 396

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]

Upvotes: 38

Related Questions