How to change the uinavigationbar title's posi

Question

I've managed to change the navigationbar height by using my own navigationbar, but the title is still centered. I want it to be at the 72px position from the left.

override func sizeThatFits(size: CGSize) -> CGSize {
   return CGSizeMake(UIScreen.mainScreen().bounds.width, 56)
}

I used this to change the height but I didn't find a way to change the position of all the items. I tried to set the frame but I can't. I can't change the position of the button too.

i wanna look like this

Answer 1

navBar.setTitleVerticalPositionAdjustment(CGFloat(7), forBarMetrics: UIBarMetrics.Default)

Answer 2

Create a UIView object add UIButton and UILabel in it to show a similar view. Add this custom view into left bar button item of navigation controller.

An example screen shot to visualise a custom view and related code:

override func viewDidLoad() {
    super.viewDidLoad()

    var customView = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 100.0, height: 44.0))
    customView.backgroundColor = UIColor.yellow

    var button = UIButton.init(type: .custom)
    button.setBackgroundImage(UIImage(named: "hamburger"), for: .normal)
    button.frame = CGRect(x: 0.0, y: 5.0, width: 32.0, height: 32.0)
    button.addTarget(self, action: #selector(menuOpen(button:)), for: .touchUpInside)
    customView.addSubview(button)

    var marginX = CGFloat(button.frame.origin.x + button.frame.size.width + 5)
    var label = UILabel(frame: CGRect(x: marginX, y: 0.0, width: 65.0, height: 44.0))
    label.text = "Inbox"
    label.textColor = UIColor.white
    label.textAlignment = NSTextAlignment.right
    label.backgroundColor = UIColor.red
    customView.addSubview(label)

    var leftButton = UIBarButtonItem(customView: customView)
    self.navigationItem.leftBarButtonItem = leftButton
}

func menuOpen(button: UIButton) {
    // Handle menu button event here...
}

Answer 3

Another solution is to simply indent the title:

let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.firstLineHeadIndent = 72

navigationBar.titleTextAttributes = [
    .foregroundColor: UIColor.purple,
    .paragraphStyle: paragraphStyle
]

Answer 4

Setting custom view with left align.

Setting custom view as leftBarButtonItem is not conveniently, because we will have a problems with back button.

Setting custom view as subview of navigationBar is not conveniently because:

• we can't to easy control width of custom view when right buttons are set. We can get overlapping custom view and right buttons
• we need to add custom navTitleView and remove it every viewWillAppear and viewWillDissapear. This is additional, not clean code.

So? I've just added width constraint to the customTitleView.

Inside of CustomTitleView class:

  private func layoutViewsConfig() {
    // Width constraint needed to align view to left
    let widthConstraint = NSLayoutConstraint.init(item: self, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: UIScreen.main.bounds.width)
    widthConstraint.priority = .init(748)
    let heightConstraint = NSLayoutConstraint.init(item: self, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 50)
   self.addConstraint(widthConstraint)
   self.addConstraint(heightConstraint)    
  }        

Then, inside of your ViewController:

var navigationTitleView = NavigationSubtitleView() 
self.navigationItem.titleView = navigationTitleView

And we have: