Navigation Bar Items not left aligned - ios

Question

I have a navigationBar where I would like to have a button on the left, a activityIndicator as title and a doneButton on the right. This is what I tried:
let activityIndicator = UIActivityIndicatorView(frame: CGRect(x: 0, y: 0, width: 25, height: 25))
let googleImage = UIImage(named: "google")!
let googleButton = UIBarButtonItem(image: googleImage, style: .plain, target: self, action: #selector(googleButtonTapped))
googleButton.image = UIImage(named: "google")?.withRenderingMode(UIImage.RenderingMode.alwaysOriginal)
navigationController?.navigationBar.barTintColor = UIColor.blueCustom
navigationController?.navigationBar.tintColor = UIColor.white
activityIndicator.hidesWhenStopped = true
activityIndicator.color = .white
self.navigationItem.titleView = self.activityIndicator
self.navigationItem.leftBarButtonItem = googleButton
self.navigationItem.rightBarButtonItem = UIBarButtonItem(title: "Fertig", style: .done, target: self, action: #selector(doneTapped))
The problem is that googleButton and activityIndicator are not on the left/center:
What am I missing here?
Update:
I tried setting the leftBarButtonItem to a simple item with title and it works as expexted.. Why is it not working with the image?

Answer 1

I think it has to do with the intrinsicContentSize of the googleButton. Since you haven't explicitly set it, the size of the google logo image is expanding the width of the button. The intrinsicContentSize property of a UIButton has a set height by default, but none for the width:
let googleImage = UIImage(named: "google")?.withRenderingMode(UIImage.RenderingMode.alwaysOriginal).resizeTo(size: CGSize(width: 25, height: 25))
let googleButton = UIButton()
googleButton.setBackgroundImage(googleImage, for: .normal)
googleButton.addTarget(self, action: #selector(googleButtonTapped), for: .touchUpInside)
let googleBarButton = UIBarButtonItem(customView: googleButton)
You can create a UIImage extension to redraw the size of the google logo:
extension UIImage {
func resizeTo(size: CGSize) -> UIImage {
let renderer = UIGraphicsImageRenderer(size: size)
let image = renderer.image { _ in
self.draw(in: CGRect.init(origin: CGPoint.zero, size: size))
}
return image.withRenderingMode(self.renderingMode)
}
}
Change the button name to:
self.navigationItem.leftBarButtonItem = googleBarButton
Of course, the 25 points for the width and the height is arbitrary. Adjust it to fit your need.