3 Tips on Maximizing Real Estate on iOS

As apps continue to build more features, they’re continuously challenged to provide an optimal user experience. Developers continue to face the challenges of showing customers what’s most relevant without taking away from the overall experience, or task at hand. Luckily, as iOS continues to evolve, so do ways of taking advantage of all the real estate iOS devices have to offer.

Here are 3 tips and tricks to help make the most of the on screen experience, without sacrificing quality, or customer experience. 

1. Status Bar

The status bar is a nice place where you can use to quickly notify the user about something that might pertain to the situation they are in, while not permanently blocking the status bar. You would show something appear over the status bar for a few seconds. Essentially what is happening is you would overlay something on a new UIWindow where the windowLevel property would be above that of the main window set in the AppDelegate.

You can see an example of this status bar notification with a good library created by me on my GitHub with some customizable properties
 

2. Navigation Bar

When scrolling through an app, whether it be a feed of some sort, or an article, it’s always nice to be able to see more of what you want to see, than more of whats just part of the native UI. The iOS UINavigationBar which comes for free part of the UINavigationController, however it takes up quite a bit of the top portion of the screen, especially when it doesn’t provide any value while trying to do the things mentioned above. Two good ways to handle this are to 1. Make the navigation bar disappear while the user is scrolling down the page, or 2. Shrink the navigation bar, so they can still see some relevant information from the navigation bar. Taking a look at Safari, and other applications like Facebook, The RealReal, and several others, when scrolling, the navigation bar disappears, or shrinks. This can be done using the UIScrollViewDelegate methods, regardless of using a UITablview, UICollectionView as they both inherit from UIScrollView. The methods that this UIScrollViewDelegate protocol provides can be found on Apple's developer site, and are very useful in crafting this solution.

You can use the `scrollViewWillBeginDragging` to determine when the user has started to scroll through your page, and the most important method to determine direction and velocity of user scrolling is `scrollViewDidScroll`. You can then in this function, play with the UINavigationBar’s height (depending on if you have this custom set) or you can easily hide it by using `navigationController.setNavigationBarHidden(true, animated: true)` (Swift).

Note: while doing this, you will still need your UIViewController to adjust the heights of your UITableView / UICollectionView

3. Tab Bar

Similar to the UINavigationBar, UITabBar is very similar, except it’s at the bottom of the screen, and again while scrolling through a page, it can be very “in the way” when trying to focus on the content. Unlike the UINavigationBar, there is no custom or easy method to call to hide the UITabBar, so you will have to manually handle this. Here are the steps:

// Get your tabBar frame

let tabBarFrame = yourViewController.tabBarController?.tabBar.frame

// Change the Y-offset of your tabBar by its height

// doWeShowTheTabBar is a Bool which is set by the caller (true = show, false = hide)

let tabBarHeight = tabBarFrame.size.height

let offsetY = doWeShowTheTabBar ? -tabBarHeight : tabBarHeight

// Animate the tabBar in the direction of preference

UIView.animateWithDuration(duration, animations: { _ in

    yourViewController.tabBarController.tabBar.frame = CGRectOffset(tabBarFrame, 0, offsetY)

}, completion: nil)

Note: The above example does not worry about optionals or unwrapping optionals. It is just showing how this can be done. There are also some nil checking and edge cases you may need to consider before doing this.

Tip: for the value of `duration` you can use `UINavigationControllerHideShowBarDuration` which is a system constant that follows the same hiding and showing of the UINavigationController.navigationBar

Ultimately, how your customers use your app will help you decide which information to display where. Ideally, user experience testing, measuring, and iterative changes will help drive a positive experience. However, when you have decided which information to display, be sure to take advantage of these tips!