Changing font in UITabBarItem

Question

Hi I have this code and it doesn't work, what am I doing wrong?

- (void)viewDidLoad
{    
    [self.tabBarItem setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIFont fontWithName:@"AmericanTypewriter" size:20.0f], UITextAttributeFont, nil] forState:UIControlStateDisabled];
}

BTW that's not the only thing in my viewDidLoad but I just wanted to show you guys thats where I put it.

Homogeneity

Can you share what version of iOS you are targeting? This feature is new to iOS 5. – Rockoon

@ctrahey I am targeting iOS 5. – Homogeneity

Answer 1

As per: How to change the Color of text in UITabBarItem in iOS 5

It looks like the solution may be sending the message to the appearance proxy, instead of one item:

(Deprecated in iOS 7.0+)

[[UITabBarItem appearance] setTitleTextAttributes:@{UITextAttributeFont: [UIFont fontWithName:@"AmericanTypewriter" size:20.0f]} forState:UIControlStateNormal];

For iOS 7.0+ use:

[[UITabBarItem appearance] setTitleTextAttributes:@{NSFontAttributeName: [UIFont fontWithName:@"AmericanTypewriter" size:20.0f]} forState:UIControlStateNormal];

Rockoon

change forstate:UIControlStateNormal – Mannie

Not explicitly mentioned here. You can put this code in the didFinishLaunchingWithOptions function in the app delegate to set it for the app – Dira

That worked for me in swift: UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont(name: "AmericanTypewriter", size: 20.0)] as [NSObject : AnyObject!], forState: UIControlState.Normal) – Candidacandidacy

NSFontAttributeName for iOS7+, and UITextAttributeFont for iOS6- – Munoz

@{NSFontAttributeName: [UIFont fontWithName:@"AmericanTypewriter" size:20.0f]} for 2015. – Swinson

change different font for Selected state is no effect – Signalment

@BeyondChao it might be worth asking a fresh question (or searching differently) as this answer is now over 6 years old! Good luck! – Rockoon

Answer 2

Swift way, for lazies:

UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont.systemFontOfSize(10)], forState: .normal)
UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont.systemFontOfSize(10)], forState: .selected)

Transmigrate

This doesn't change the font for me for .selected state. – Wrung

@AbbasAngouti for changing font is selected state you should use something like this: https://mcmap.net/q/409041/-change-tabbaritem-title-font-to-bold-in-swift-for-ios – Conradconrade

Update, as of iOS 15, if the UITabBar uses UITabBarItemAppearance(), it will override any fonts set in the UITabBarItem.appearance() setting – Gyrostat

Answer 3

Swift 4.1 and custom font

UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.font: UIFont(name: "Montserrat-Medium", size: 11)], for: .normal)
UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.font: UIFont(name: "Montserrat-Medium", size: 11)], for: .selected)

Whomp

Answer 4

Swift 3

UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont(name: "OpenSans", size: 10)!], for: .normal)

Anthe

Answer 5

Swift 5

Lets say you have a class that inherits UITabBarController like below:

final class YourTabBarController: UITabBarController { .. }

Define 2 types of attribute in this YourTabBarController:

let normalTabBarAttributes: [NSAttributedString.Key: Any] = [
    .font: NotSelectedFont,
    .foregroundColor: NotSelectedColor
]
let selectedTabBarAttributes: [NSAttributedString.Key: Any] = [
    .font: SelectedFont,
    .foregroundColor: SelectedColor
]

And you have a ViewController named YourViewController that contains the TabBar and inherits UIViewController like below:

final class YourViewController: UIViewController {...}

iOS 15.0 or later version

Define a method in YourViewController:

private func setTabBarAttributes() {
    guard let yourTabBarController = tabBarController as? YourTabBarController else {
        return
    }
    let appearance = UITabBarAppearance()
    appearance.stackedLayoutAppearance.normal.titleTextAttributes = yourTabBarController.normalTabBarAttributes
    appearance.stackedLayoutAppearance.selected.titleTextAttributes = yourTabBarController.selectedTabBarAttributes
    yourTabBarController.tabBar.standardAppearance = appearance
    yourTabBarController.tabBar.scrollEdgeAppearance = appearance
}

Form override func viewDidLoad() method of YourViewController call that method:

setTabBarAttributes()

previous versions of iOS 15.0

In YourTabBarController you can define a method :

private func updateTabBarAttributes() {
    guard let viewControllers = viewControllers else { return }
    for viewController in viewControllers {
        if viewController == selectedViewController {
            viewController.tabBarItem.setTitleTextAttributes(selectedTabBarAttributes, for: .normal)
        } else {
            viewController.tabBarItem.setTitleTextAttributes(normalTabBarAttributes, for: .normal)
        }
    }
}

Now use the method like below:

override var selectedIndex: Int {
    didSet {
        updateTabBarAttributes()
    }
}

override var selectedViewController: UIViewController? {
    didSet {
        updateTabBarAttributes()
    }
}

Emeraldemerge

Answer 6

Swift 4

UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.font: UIFont.tabbar], for: .normal)

Masry

Answer 7

If I added the code in viewDidLoad() then I was never able to change the font when the tabbar was selected.

This is a great article that explains how to do it with more details: HolySwift Article

In a nutshell, you need to add the following code in your tabbar controller:

override var selectedIndex: Int { 
    didSet {
        guard let selectedViewController = viewControllers?[selectedIndex] else {
            return
        }
        selectedViewController.tabBarItem.setTitleTextAttributes([.font: UIFont.boldSystemFont(ofSize: 13)], for: .normal) 
    }
}

And this:

override var selectedViewController: UIViewController? { 
    didSet {

        guard let viewControllers = viewControllers else {
            return
        }

        for viewController in viewControllers {
            if viewController == selectedViewController {
                viewController.tabBarItem.setTitleTextAttributes([.font: UIFont.boldSystemFont(ofSize: 13)], for: .normal)
            } else {
                viewController.tabBarItem.setTitleTextAttributes([.font: UIFont.systemFont(ofSize: 12)], for: .normal)
            }
        }
    }
}

PS: This will work with custom fonts as well.

Yecies