How to programmatically create a UIBarButton back element in Swift?

I managed to create a UIBarButton element that can programmatically go back using the following code:

func backAction() -> Void { self.navigationController?.popViewControllerAnimated(true) } override func viewDidLoad() { super.viewDidLoad() let backButton = UIBarButtonItem(title: "Back", style: UIBarButtonItemStyle.Plain, target: self, action: "backAction") self.navigationItem.leftBarButtonItem = backButton } 

The problem is that the back button does not have a left arrow: enter image description here Is there a way to make it look like a regular back button with an arrow like this: enter image description here

I would also like to know if it is possible to make the names of the button headers as the title of the previous view controller, if possible.

thanks

+12
source share
5 answers

Below is the code using UIButton with image, you can add it as a custom view for UIBarButtonItem

 override func viewDidLoad() { super.viewDidLoad() var backbutton = UIButton(type: .Custom) backbutton.setImage(UIImage(named: "BackButton.png"), forState: .Normal) // Image can be downloaded from here below link backbutton.setTitle("Back", forState: .Normal) backbutton.setTitleColor(backbutton.tintColor, forState: .Normal) // You can change the TitleColor backbutton.addTarget(self, action: "backAction", forControlEvents: .TouchUpInside) self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backbutton) } func backAction() -> Void { self.navigationController?.popViewControllerAnimated(true) } 

BackButton.png Download link

To set the button title with the previous title of the view controller, you must pass the title as a string, presenting the controller, changing the code above as.

 var titleStrFromPreviousController: String // This value has to be set from previous controller while presenting modal controller backbutton.setTitle(titleStrFromPreviousController, forState: .Normal) 

This can help.

Swift 3

 override func viewDidLoad() { super.viewDidLoad() addBackButton() } func addBackButton() { let backButton = UIButton(type: .custom) backButton.setImage(UIImage(named: "BackButton.png"), for: .normal) // Image can be downloaded from here below link backButton.setTitle("Back", for: .normal) backButton.setTitleColor(backButton.tintColor, for: .normal) // You can change the TitleColor backButton.addTarget(self, action: #selector(self.backAction(_:)), for: .touchUpInside) self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backButton) } @IBAction func backAction(_ sender: UIButton) { let _ = self.navigationController?.popViewController(animated: true) } 
+35
source

Updated for Swift 4.2 - thanks to sam bing and silentbeep

Some changes made to some colors and action selector.

  override func viewDidLoad() { super.viewDidLoad() self.view.backgroundColor = .blue self.navigationItem.title = title self.navigationController?.navigationBar.barTintColor = .white self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: makeBackButton()) } func makeBackButton() -> UIButton { let backButtonImage = UIImage(named: "backbutton")?.withRenderingMode(.alwaysTemplate) let backButton = UIButton(type: .custom) backButton.setImage(backButtonImage, for: .normal) backButton.tintColor = .blue backButton.setTitle(" Back", for: .normal) backButton.setTitleColor(.blue, for: .normal) backButton.addTarget(self, action: #selector(self.backButtonPressed), for: .touchUpInside) return backButton } @objc func backButtonPressed() { dismiss(animated: true, completion: nil) // navigationController?.popViewController(animated: true) } 
+6
source

You can do this by adding your view to the navigation controller. Here is an image showing how to do this: navigationController

Hope this helps: D

+4
source

The first answer works fine, but the image is too large, so use the preview and scale it to a width of: 13 and height: 22, also set the rendering mode to .alwaysTemplate and change the UIButton to white, and add two spaces before the line: "Back " This will result in a quiet, similar to the navigation bar button, image may be better in terms of size and placement.

Edited Code:

  func addBackButton() { let backButtonImage = UIImage(named: "BackButton.png")?.withRenderingMode(.alwaysTemplate) let backButton = UIButton(type: .custom) backButton.setImage(backButtonImage, for: .normal) backButton.tintColor = .white backButton.setTitle(" Back", for: .normal) backButton.setTitleColor(.white, for: .normal) backButton.addTarget(self, action: #selector(self.backAction(_:)), for: .touchUpInside) self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backButton) } 
+1
source

I changed one last line of code from the selected answer and it works for me.

 override func viewDidLoad() { super.viewDidLoad() addBackButton() } func addBackButton() { let backButton = UIButton(type: .custom) backButton.setImage(UIImage(named: "BackButton.png"), for: .normal) // Image can be downloaded from here below link backButton.setTitle("Back", for: .normal) backButton.setTitleColor(backButton.tintColor, for: .normal) // You can change the TitleColor backButton.addTarget(self, action: #selector(self.backAction(_:)), for: .touchUpInside) self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backButton) } @IBAction func backAction(_ sender: UIButton) { let _ = self.dismiss(animated: true, completion: nil) } 
0
source

All Articles