How do I change the font of the back button for my navigation bar?

How to change the font of the back button for my navigation bar.

The back button is either the back button or the title from the previous view controller.

I thought this viewDidLoad would work:

 navigationController?.navigationItem.leftBarButtonItem?.setTitleTextAttributes([NSFontAttributeName: UIFont(name: "FONTNAME", size: 20)!], forState: UIControlState.Normal) 

but optional leftBarButton? returns nil .

+35
ios cocoa-touch swift uinavigationcontroller uinavigationbar
Dec 20 '14 at 18:58
source share
6 answers

Just checked your code, and it looks like the reason the nil string is returned is actually because name: "FONTNAME" returns nil. Therefore, if you set a valid font name for this attribute name , the code should work without error - even if navigationController?.navigationItem.leftBarButtonItem explicitly set to nil.

But no matter what I saw through testing, this line will not give you the result that you apparently want. The leading navigationController must not be there, as it refers to your UINavigationController and not to the current view. Just use the UIViewController own navigationItem property to directly access its leftBarButtonItem , for example:

 let backButton = UIBarButtonItem(title: "< Back", style: UIBarButtonItemStyle.Plain, target: self, action: "goBack") navigationItem.leftBarButtonItem = backButton navigationItem.leftBarButtonItem?.setTitleTextAttributes([NSFontAttributeName: UIFont(name: "Chalkduster", size: 20)!], forState: UIControlState.Normal) 

Change From the comment posted in this answer, it seems that you really do not want to set leftBarButtonItem , but backBarButtonItem , because you do not want to implement a custom action, with the exception of returning to the previous view controller.

So, in this previous view controller (that is, in the view before you want to display your custom back button element), you can configure your custom back button without action:

 let backButton = UIBarButtonItem(title: "< Back", style: UIBarButtonItemStyle.Plain, target: self, action: nil) backButton.setTitleTextAttributes([NSFontAttributeName: UIFont(name: "Chalkduster", size: 20)!], forState: UIControlState.Normal) navigationItem.backBarButtonItem = backButton 
+29
Dec 20 '14 at 19:31
source share

If you need to completely change the font style entirely in the entire application (that is, for each navigation button), the preferred method is to use the UIBarButtonItem.appearance() proxy.

A sample code might look like this:

SWIFT 3.0+

 //make sure font name u use below *actually* exists in the system ! //if it does not app will crash because we're force unwrapping an optional (see below) !!! let customFont = UIFont(name: "customFontName", size: 17.0)! UIBarButtonItem.appearance().setTitleTextAttributes([NSFontAttributeName: customFont], for: .normal) 

It is advisable to place this piece of code somewhere at the beginning of your AppDelegate.swift file, because font styling should happen every time the application starts. In addition, you can put this code in any other place (for example, the Presenter class) where you style and customize your user interface. Once this code is executed, all of your BarButton buttons will be configured after that.




BUT like a real Swift 🤓, you must first optionally expand your font and eventually use the system font if it is not found or if there is any other possible problem during font loading.

 var textAttributes: [String:Any] //custom font setup let fontColor = UIColor.purple let barItemCustomFont = UIFont(name: "👑", size: 14) //note we're not forcing anything here //can we use our custom font 🤔 if let customFont = barItemCustomFont { //hooray we can use our font 💪 textAttributes = [NSForegroundColorAttributeName: fontColor, NSFontAttributeName: customFont] } else { //👎 not found -> omit setting font name and proceed with system font textAttributes = [NSForegroundColorAttributeName: fontColor] } //finally UIBarButtonItem.appearance().setTitleTextAttributes(textAttributes, for: .normal) 

Real world example

In a real application, it is usually required to adjust the font style of the UINavigationBar and UIBarButton (among other parameters) to make them visually consistent. Here's a handy stylizeNavigationFontOfMyAmazingApp🎨 function that you can use:

 func stylizeNavigationFontOfMyAmazingApp🎨() { //custom font let customFont = UIFont(name: "someFancyFont", size: 16)! //note we're force unwrapping here //navigation bar coloring: UINavigationBar.appearance().tintColor = UIColor.white UINavigationBar.appearance().barTintColor = UIColor.blue //unique text style: var fontAttributes: [String: Any] fontAttributes = [NSForegroundColorAttributeName: UIColor.red, NSFontAttributeName: customFont] //navigation bar & navigation buttons font style: UINavigationBar.appearance().titleTextAttributes = fontAttributes UIBarButtonItem.appearance().setTitleTextAttributes(fontAttributes, for: .normal) 

}




Benefits of using a proxy server appearance()

  • Two-line code snippet to style each UIBarButtonItem in your application / project.
  • You can mix the appearance() proxy of several classes to get a truly unique visual style.
  • If you need additional control over the settings, you can reconfigure each button further (for example, place custom views, buttons, images, etc.) for a specific instance of UIBarButtonItem .

Link

Apple Docs by appearance protocol.

+64
Feb 05 '15 at 15:10
source share

If you want to apply this change to all your applications, you can use the code below:

Swift 4

I added these lines to AppDelegate.swift in application :

 func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { UINavigationBar.appearance().titleTextAttributes = [ NSAttributedStringKey.font: UIFont(name: "IranSansMobile", size: 20)! ] UIBarButtonItem.appearance().setTitleTextAttributes([NSAttributedStringKey.font: UIFont(name: "IranSansMobile", size: 15)!], for: UIControlState.normal) return true } 

Swift 3

 func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { UINavigationBar.appearance().titleTextAttributes = [ NSFontAttributeName: UIFont(name: "IranSansMobile", size: 20)! ] UIBarButtonItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont(name: "IranSansMobile", size: 15)!], for: UIControlState.normal) return true } 
+20
Feb 25 '17 at 10:30
source share

When you are sure that you have already set UIBarButtonItem , you can do:

 self.navigationItem.leftBarButtonItem!.title = "myTitle" 

To change, for example, color, you can do the following:

 self.navigationItem.leftBarButtonItem!.tintColor = UIColor.redColor() 

If you did not install it in your storyboard, you can do:

 self.navigationItem.leftBarButtonItem = UIBarButtonItem() 

To change the font, follow these steps:

 self.navigationItem.leftBarButtonItem!.setTitleTextAttributes([NSFontAttributeName: UIFont(name: "FONTNAME", size: 20)!], forState: .Normal) 

Perhaps I should mention that you should not use self. navigationController , because when you configure the navigationController buttons, they do not appear on the screen, so as a result, the buttons that are on the screen and were installed in the storyboard should be self.navigationItem ...

+3
Dec 20 '14 at 19:08
source share

SWIFT 3

  UINavigationBar.appearance().titleTextAttributes = [NSFontAttributeName: UIFont(name: "Open Sans", size: 15)!,NSForegroundColorAttributeName: UIColor.white] UIBarButtonItem.appearance().setTitleTextAttributes([NSFontAttributeName: UIFont(name: "Open Sans", size: 15)!], for: UIControlState.normal) 
+3
Jan 25 '17 at 10:30
source share

For iOS 13, Swift 5.1:

 let fontAttr = [NSAttributedString.Key.font: \*your font*\] let buttonAppearance = UIBarButtonItemAppearance() buttonAppearance.normal.titleTextAttributes = fontAttr let navbarAppearance = UINavigationBarAppearance() navbarAppearance.buttonAppearance = buttonAppearance UINavigationBar.appearance().standardAppearance = navbarAppearance 
+1
Sep 23 '19 at 8:41
source share



All Articles