Align app logo to left of the navigation bar

Question

I want to put logo of my app as button on left of the navbar.

I tried to implement the same by calling configureNavbar() function in init of the veiw controller. Definition of the function is as follows:

private func  configureNavbar(){
        var image = UIImage (named: "NetflixLogo")
        image = image?.withRenderingMode(.alwaysOriginal)
        navigationItem.leftBarButtonItem = UIBarButtonItem(image: image, style: .plain, target:  self, action: nil)
    }

By this I am getting logo in middle of the navbar like this:

But by using:

navigationItem.rightBarButtonItems = [
            UIBarButtonItem(image: UIImage(systemName: "person"), style: .done, target: self, action: nil),
            UIBarButtonItem(image: UIImage(systemName: "play.rectangle"), style: .done, target: self, action: nil),
        ]

I can see items at right of navbar.

Pls help how can I align app logo to the left?

This is what I am getting in debug hierarchy

Try using an actual small square image instead of a wide rectangular image. — HangarRash, Nov 27 '22 at 00:21
Can you try something like this? https://stackoverflow.com/a/48618571/10175156 — Teju Amirthi, Nov 27 '22 at 01:45
@TejuAmirthi tried this but image got stretched in horizontal direction to all the width shown in debug hierarchy. And now icons on right are also not visible — RONIT CHAURASIA, Nov 27 '22 at 06:25

score 2 · Accepted Answer · edited Mar 21 '23 at 05:59

In viewDidLoad set your custom view and add to navbar like a custom view:

    let leftNavBarImageView = UIImageView()
        leftNavBarImageView.image = UIImage(named: "yourImage")
        leftNavBarImageView.contentMode = .scaleAspectFill
        leftNavBarImageView.backgroundColor = .white
        leftNavBarImageView.layer.cornerRadius = 4 // if you don't want corner radius comment this line
        leftNavBarImageView.clipsToBounds = true
        leftNavBarImageView.widthAnchor.constraint(equalToConstant: 40).isActive = true // set image view width constraint
        leftNavBarImageView.heightAnchor.constraint(equalToConstant: 40).isActive = true // set image view height constraint
        navigationItem.leftBarButtonItem = UIBarButtonItem(customView: leftNavBarImageView) // add left bar button custom view

This is the result:

Align app logo to left of the navigation bar

1 Answers1

Linked