Customizing text color AND font of UITabBarItem causing weird result in swift

Question

I am trying to change the text of my UITabBarItems and have used questions such as this. The second answer works great for me unless I try to adjust the font of the UITabBarItem. This snippet produces the expected results of the selected text being white and the unselected item being light gray:

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blackColor()], forState:.Normal)

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.whiteColor()], forState:.Selected)

However, if this is added :

UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName:UIFont(name: "American Typewriter", size: 13)!], forState: .Selected)

For some reason the text becomes black when it is both selected and unselected and the font remains unchanged.

Weirdly enough if I change .Selected to .Normal in the last snippet, then the selected text turns white and the text is made to match the font in the code.

UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName:UIFont(name: "American Typewriter", size: 13)!], forState: .Normal)

This is almost perfect however the unselected text is now unchanged. Im not sure if I am doing something wrong or this is a bug, but if there are any other methods to completing this task, I would love to hear it.

Based on dfri's comments I have tried this:

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blackColor(),
        NSFontAttributeName : [NSFontAttributeName:UIFont(name: "American Typewriter", size: 13)!]], forState:.Selected)

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName : UIColor.whiteColor(),
        NSFontAttributeName : [NSFontAttributeName:UIFont(name: "American Typewriter", size: 13)!]], forState:.Normal)

and now the app is crashing. The error says :

unrecognized selector sent to instance 0x7fa6d9461ef0

which does not make any sense to me

@dfri this causes the same results as the second snippet where the text is always black — JCode, Dec 30 '15 at 22:38
@dfri I think i interpreted your comment correctly where I should try setting both the color and the font at the same time however, when I tried that it crashes the app. Check the updated question. The same result occurred when the attributes were stored in an outside array — JCode, Dec 30 '15 at 23:13

score 19 · Accepted Answer · answered Dec 30 '15 at 23:15

19

Try the following

let colorNormal : UIColor = UIColor.blackColor()
let colorSelected : UIColor = UIColor.whiteColor()
let titleFontAll : UIFont = UIFont(name: "American Typewriter", size: 13.0)!

let attributesNormal = [
    NSForegroundColorAttributeName : colorNormal,
    NSFontAttributeName : titleFontAll
]

let attributesSelected = [
    NSForegroundColorAttributeName : colorSelected,
    NSFontAttributeName : titleFontAll
]

UITabBarItem.appearance().setTitleTextAttributes(attributesNormal, forState: .Normal)
UITabBarItem.appearance().setTitleTextAttributes(attributesSelected, forState: .Selected)

answered Dec 30 '15 at 23:15

dfrib

70,367
12
127
192

2

This doesn't change the font for me for `.selected` state. – AydinAngouti Jan 31 '17 at 18:14
@AbbasAngouti make sure you add this in your AppDelegate class. Should work fine. – Khaledonia Sep 10 '17 at 09:40

Mikkel Cortnum · Answer 2 · 2021-05-10T15:56:12.733

For iOS 10 and above, you only need to change the font for .normal, this will affect fonts on both selected and unselected items.

UITabBarItem.appearance().setTitleTextAttributes([NSFontAttributeName : UIFont.myMediumFont(withSize: 10)], for: [.normal])

Also, you can set the tintColors without using .setTitleTextAttributes like so:

UITabBar.appearance().unselectedItemTintColor = UIColor.white
UITabBar.appearance().tintColor = UIColor.black

score 0 · Answer 3 · answered Jan 05 '23 at 07:03

I am using iOS 15.5. I was trying to change font size of tab bar item title with all the solutions provided above. However nothing worked for me. Then I tried to modify stackedLayoutAppeaarance under UITabBarAppearance instead of UITabBar.appearance().

What has worked for me is the following code:

let tabBarAppearance = UITabBarAppearance()
tabBarAppearance.configureWithOpaqueBackground()
tabBarAppearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 12.0)]

Customizing text color AND font of UITabBarItem causing weird result in swift

3 Answers3