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.

Can you share what version of iOS you are targeting? This feature is new to iOS 5. — Chris Trahey, Jun 17 '12 at 06:56

score 73 · Accepted Answer · edited May 31 '18 at 00:33

73

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];

edited May 31 '18 at 00:33

pkamb

33,281
23
160
191

answered Jun 17 '12 at 07:00

Chris Trahey

18,202
1
42
55

4

change forstate:UIControlStateNormal – Paresh Navadiya Jun 17 '12 at 15:30
3

Not explicitly mentioned here. You can put this code in the didFinishLaunchingWithOptions function in the app delegate to set it for the app – sam_smith Dec 23 '14 at 10:38
1

That worked for me in swift: UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont(name: "AmericanTypewriter", size: 20.0)] as [NSObject : AnyObject!], forState: UIControlState.Normal) – Reinhold Jun 27 '15 at 16:40
2

NSFontAttributeName for iOS7+, and UITextAttributeFont for iOS6- – DawnSong Aug 18 '15 at 08:20
1

`@{NSFontAttributeName: [UIFont fontWithName:@"AmericanTypewriter" size:20.0f]}` for 2015. – Iulian Onofrei Oct 19 '15 at 11:56
change different font for **Selected** state is no effect – Beyond Chao Aug 10 '18 at 02:55
@BeyondChao it might be worth asking a fresh question (or searching differently) as this answer is now over 6 years old! Good luck! – Chris Trahey Aug 11 '18 at 00:30

score 18 · Answer 2 · edited May 08 '17 at 20:37

18

Swift way, for lazies:

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

edited May 08 '17 at 20:37

Andrei Konstantinov

6,971
4
41
57

answered Jun 21 '16 at 07:31

Wujo

1,845
2
25
33

6

This doesn't change the font for me for `.selected` state. – AydinAngouti Jan 31 '17 at 18:13
2

@AbbasAngouti for changing font is selected state you should use something like this: https://stackoverflow.com/a/47529912/1980246 – Timur Bernikovich Nov 28 '17 at 11:00
Update, as of iOS 15, if the UITabBar uses UITabBarItemAppearance(), it will override any fonts set in the UITabBarItem.appearance() setting – PhoenixB Jul 01 '22 at 23:04

score 12 · Answer 3 · answered Nov 29 '18 at 06:54

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)

score 5 · Answer 4 · answered Mar 10 '17 at 13:48

5

Swift 3

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

answered Mar 10 '17 at 13:48

Artur

336
3
10

score 3 · Answer 5 · answered Oct 01 '18 at 13:11

3

Swift 4

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

answered Oct 01 '18 at 13:11

niggeulimann

688
6
15

score 2 · Answer 6 · answered Jan 19 '23 at 06:16

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

christostsang · Answer 7 · 2021-06-30T10:45:32.057

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.

Changing font in UITabBarItem

7 Answers7

Linked