Tag Archives: UINavigationBar

How to create multiple buttons in a UINavigationBar

Screen Shot 2014-05-17 at 09.54.04Sometimes a single button left and right is just not enough for complex apps. Especially on the iPad we have this large space in the navigation bar. But Interface Builder only allows us to add one button on the left and one on the right.

How do we add more buttons to those spaces? Code is the answer.

Both the left and the right space of a UINavigationBar can take an array of barButtonItems which we can populate with as many buttons as space will allow.

In this example I’m using the Master/Detail template to create an array in the viewDidLoad method of the DetailViewController. This will create the effect shown in the screenshot:

Note how you can create fixed spaces between the buttons as shown.

You can also space those buttons evenly across the whole bar by using the UIBarButtonSystemItemFlexibleSpace, in which case there’s no need to pass the width parameter. When you do, the buttons will be spaced between the right side of the bar and the title if there is one, or across the whole bar if the title is empty.

How to turn the Navigation Bar in iOS 6 opaque when compiling with Xcode 5

Xcode 5 is nice… but it has habits that drive me up the wall. For example, no matter which Base SDK you compile with, your Navigation Bars will always look translucent – no matter how hard you try to avoid this in the Storyboard, and no matter which iOS Version you deploy to.

Would have never happened under Xcode 4. But I suppose we must go with the times.

All we can do is to turn it opaque in code – and if we’re not using black, at least give iOS 7 a tint of your selected colour at the same time. This method will take a UINavigationController and change its colour:

Note that on iOS 7 your navigation bars are always translucent, I haven’t found a way to change this. All you can do is “tint” those. The above code will however bring opaqueness back into your apps when running on iOS 6.

How to set the colour in a UINavigationBar

Since Xcode 5 and iOS 7 the default appearance of a UINavigationBar is black translucent. This even affects the same app running in iOS 6. Black opaque is deprecated and can no longer be set in Interface Builder.

However, you can set the appearance for all nav bars by putting this little gem in your App Delegate’s didFinishLaunchingWithOptions method:

You can specify colours other than black.

Note that iOS 7 devices are affected differently by this change: only the icon/text colour will change into your specified colour, but the bar itself will remain translucent. Using black means text buttons are barely readable. Hence, a version check would be appropriate:

How to hide a UIBarButtonItem in your Navigation Controller

Since UIBarButtonItems do not have a “hidden” property, we can’t just set this to yes and it’ll disappear. Instead, we can set them to nil.

In this example we’re hiding the right item in the navigation controller:

How to hide navigation elements with swishy animations

You can hide (and show) navigation bars and toolbars from your UINavigationController with extremely funky animations, much like we see in the Photos app on iOS. In the app, when you single-tap the screen, both top and bottom toolbars disappear.

Here’s how we do that: Provided you have your view controller embedded in a UINavigationController, you can call the following methods to slide the top and bottom bars in and out:

On the same note, you can do the same (and better) with the status bar at the very top of your screen (that’s the one that contains the time and carrier).

Here you even have a choice of

  • UIStatusBarAnimationSlide
  • UIStatusBarAnimationFade
  • UIStatusBarAnimationNone

How to create a UIBarButtonItem in code and make it call a method

Some things are really easy to do via a Storyboard – but when you want to create the same thing in code I frequently forget how to do it.

Turns out it’s equally simple: this example assumes you have a View Controller which is embedded in a Navigation Controller (so it already has a UINavigationBar at the top). Here’s how you add a button to it, set the title and target, and tell it what to do when it’s pressed:

You can set the button on the left hand site by using self.navigationItem.leftBarButtonItem