0

I want to personalize the Back Button of my app to have a consistent looking. So I'm setting a image as the Back Button of a Navigation Bar.

The code bellow works fine on any iOS above iOS 10. So, I'm trying to make it work on iOS 10.3.1.

This is basically all the code, that I'm setting on AppDelegate didFinishLaunchingWithOptions

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        applyNavigationAppearances()
        return true
    }

    private func applyNavigationAppearances() {
        let navigationAppearance = UINavigationBar.appearance()
        navigationAppearance.barTintColor = .white
        navigationAppearance.barStyle = .black
        navigationAppearance.backIndicatorImage = UIImage()
        navigationAppearance.backIndicatorTransitionMaskImage = UIImage()
        navigationAppearance.tintColor = .gray

        navigationAppearance.titleTextAttributes = [
            NSAttributedString.Key.foregroundColor: UIColor.gray,
            NSAttributedString.Key.font: UIFont(name: "Helvetica-Bold", size: 20)
        ]

        let backImage = UIImage(named: "chevron-orange-left")
        let backImageUIEdgeInsets = UIEdgeInsets(top: -4, left: -8, bottom: -2, right: 8)
        let backImageWithAlignmentRectInsets = backImage?.withAlignmentRectInsets(backImageUIEdgeInsets)
        let barButtonAppearance = UIBarButtonItem.appearance()

        barButtonAppearance.setBackButtonBackgroundVerticalPositionAdjustment(-1.0, for: .default)
        barButtonAppearance.setBackButtonBackgroundImage(backImageWithAlignmentRectInsets, for: .normal, barMetrics: .default)
    }

This is what I want and get on any iOS above 10:

image This is what I get on iOS 10.3.1:

image Edit 1: It's worth saying this is a big app. A solution that didn't involved changing every ViewController would be ideal.

Edit 2: Thank you for answer guys. However, all solutions posted here are distorting the image shorter or longer, so they don't quite solve my problem.

Tassio Marques
  • 81
  • 1
  • 10
  • https://stackoverflow.com/a/37337255/10758374 – AfnanAhmad Aug 09 '19 at 13:02
  • It sort of works, but then the icon is getting smaller: https://imgur.com/a/qVXdJ6Q – Tassio Marques Aug 09 '19 at 13:13
  • Possible duplicate of [How to remove all navigationbar back button title](https://stackoverflow.com/questions/29912489/how-to-remove-all-navigationbar-back-button-title) – zero3nna Aug 09 '19 at 13:38
  • @zero3nna I've seen this one. It didn't solve my problem. I'm always getting weird behavior on iOS 10.3 – Tassio Marques Aug 09 '19 at 13:43
  • @TassioMarques the solutions in there are working fine up to iOS 12, so you might need to change to something else and subclass your VC's. you cant do this via appDelegate but I also dont see anything in your code that tries to clear the default backButton. – zero3nna Aug 09 '19 at 13:59

1 Answers1

0

You have:

  let backImage = UIImage(named: "icon")
  let backImageUIEdgeInsets = UIEdgeInsets(top: -4, left: -8, bottom: -2, right: 8)
  let backImageWithAlignmentRectInsets = backImage?.withAlignmentRectInsets(backImageUIEdgeInsets)
  appearance.setBackButtonBackgroundVerticalPositionAdjustment(-1.0, for: .default)
  appearance.setBackButtonBackgroundImage(backImageWithAlignmentRectInsets,
                                          for: .normal,
                                          barMetrics: .default)

enter image description here

After that you can add :

 appearance.setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.clear],
                                   for: .normal)
 appearance.setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.clear],
                                   for: .highlighted)

enter image description here

I check this on iPhone 7 10.3.1

Eugene Lezov
  • 722
  • 7
  • 12
  • Yeah, I've try that, but then the image is all stretched out. For the image you are using it works fine, but for the one I want, it only hides the text and stills distorts the icon. – Tassio Marques Aug 10 '19 at 13:10