How to create a custom navigation bar in Swift Xcode?

Question

I am working on a chat app for my graduation project in iOS. I designed the following navigation bar:

Now I am trying to develop above graphic in my Xcode project, but I don't know if this is the correct way to achieve this and doesn't get it like the graphic.

I am using a xib file, that I load in my ViewController.swift using an instance of it. Than add it as the titleView of the navigationItem:

let helperView = HelperView()
navigationItem.titleView = helperView

This is the result of above code snippet:

The problem of this result is that it is overlapping the left bar button item and another problem, that I still doesn't figured out is, if the message bubble can have a dynamic height, when it have multiple lines (max is 3 lines).

Does anyone have experience with this kind of design within Xcode and is this the correct way to do this, or is there a better way to achieve this. Maybe a custom UINavigationController class?

Answer 1

Try create the whole navigation view that you desire, that mean the width is equal to the view, then try use this code to add it

    navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
    navigationController?.navigationBar.shadowImage = UIImage()
    navigationController?.navigationBar.backgroundColor = .clear

    navigationController?.view.insertSubview(subview, belowSubview: navigationController?.navigationBar)

It will makes your navigation bar become invisible but still showing the bar button

Update, by dimpiax

But better to override your UINavigationController class, and setup view in viewDidLoad

navigationBar.shadowImage = UIImage()
navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationBar.backgroundColor = .clear

And on dependent viewController's view – show specific view.