Swift Custom NavBar后退按钮图像和文本

我需要在Swift项目中自定义后退按钮的外观。

这就是我所拥有的：

这就是我想要的：

我已经尝试创建自己的UIBarButtonItem，但我无法弄清楚如何将图像放在文本旁边，而不是作为文本的背景或替代。

let backButton = UIBarButtonItem(title: "Custom", style: .Plain, target: self, action: nil ) //backButton.image = UIImage(named: "imageName") //Replaces title backButton.setBackgroundImage(UIImage(named: "imageName"), forState: .Normal, barMetrics: .Default) // Stretches image navigationItem.setLeftBarButtonItem(backButton, animated: false) 

Answer 1

你可以这样做：

 let yourBackImage = UIImage(named: "back_button_image") self.navigationController?.navigationBar.backIndicatorImage = yourBackImage self.navigationController?.navigationBar.backIndicatorTransitionMaskImage = yourBackImage self.navigationController?.navigationBar.backItem?.title = "Custom" 

您的图像只有一种颜色

Answer 2

注意 ：请记住，后退按钮属于源ViewController，而不属于目标ViewController。 因此，需要在源VC中进行修改，源VC反映到导航控制器中的所有视图

代码片段：

 let backImage = UIImage(named: "icon-back") self.navigationController?.navigationBar.backIndicatorImage = backImage self.navigationController?.navigationBar.backIndicatorTransitionMaskImage = backImage /*** If needed Assign Title Here ***/ self.navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: UIBarButtonItemStyle.plain, target: nil, action: nil) 

Answer 3

迅速4

在我的情况下，我只需要按钮的图像，没有任何文字。 我希望这对某人有用。

 let imgBackArrow = UIImage(named: "back_arrow_32") navigationController?.navigationBar.backIndicatorImage = imgBackArrow navigationController?.navigationBar.backIndicatorTransitionMaskImage = imgBackArrow navigationItem.leftItemsSupplementBackButton = true navigationItem.leftBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: self, action: nil) 

Answer 4

在带有图像和文本的导航栏中有一个按钮非常困难。 特别是他们在iOS 11中引入了UIBarButtonItem位置的新头痛： iOS 11 – UIBarButtonItem水平位置

您可以创建带图像的按钮或带文本的按钮，但不能创建具有这两个按钮的按钮。 我甚至尝试了两个UIBarButtonItems，一个带有图像，另一个带有文本 – 它仍然看起来不太好，并且它们的UIStackView无法轻易访问以进行修改。

出乎意料的是，我找到了一个简单的解决方案：

1）在Interface Builder中将按钮设计为视图。 在我的例子中，它是在目标UIViewController内部，并且为了简单起见可通过IBOutlet访问

2）将图像的前导空间约束设置为负，您可能还需要将视图的背景颜色设置为.clear。

3）使用它：

 @IBOutlet var backButtonView: UIView! override func viewDidLoad() { super.viewDidLoad() let backButton = UIBarButtonItem(customView: self.backButtonView) self.backButtonView.heightAnchor.constraint(equalToConstant: 45).isActive = true self.backButtonView.widthAnchor.constraint(equalToConstant: 75).isActive = true self.navigationItem.leftBarButtonItem = backButton } 

而已。 不需要使用iOS 10的负间隔技巧或iOS 11的imageInsets技巧（仅当你有图像并且不适用于图像+文本，BTW时才有效）。

Answer 5

对于后退按钮图像：

• 通过本教程 :(但对我不起作用）

   UINavigationBar.appearance().backIndicatorImage = UIImage(named: "imageName") 

• 但是这个堆栈答案 :(为我工作）

   let backButtonImage = UIImage(named: "back-button-image") backButtonImage = backButtonImage?.stretchableImageWithLeftCapWidth(15, topCapHeight: 30) UIBarButtonItem.appearance().setBackButtonBackgroundImage(backButtonImage, forState: .Normal, barMetrics: .Default) 

对于字体，假设您希望字体与整个导航栏匹配:(当前正在使用中）

 if let font = UIFont(name: "Avenir-Book", size: 22) { UINavigationBar.appearance().titleTextAttributes = [NSFontAttributeName: font] } 

Answer 6

迅捷3

  extension UIViewController { func setBackButton(){ let yourBackImage = UIImage(named: "backbutton") navigationController?.navigationBar.backIndicatorImage = yourBackImage navigationController?.navigationBar.backIndicatorTransitionMaskImage = yourBackImage } }