iOS 7 UITableView using transparent Navigation bar and toolbar

Question

Just like the Facebook / Venmo app how do I set the UITableView so the content will scroll under the translucent navigation bar and bottom toolbar, but you can still scroll to the top and the bottom without it being obscured by the nav or toolbar?

Thanks!

Answer 1

I assume that you want to build an iOS7 app.

In general this is done automatically when you build with the new SDK.

For example you set you UITableView or UIScrollView with Autolayouts (expanding to the full height of the view controllers view).

UIViewControllers have a new property in iOS 7 called edgesForExtendedLayout. The default value here is UIRectEdgeAll, means that the controller expands its content to all edges. If your view controller is nested in a UINavigationController or UITabBarController then it automatically sets the content insets, so you can scroll to the top and bottom and see all items (or cells or whatever). Then when you scroll the content offscreen you can see that new iOS7 blur effect of the bars.

Keep in mind, that for positioning other UI elements below the navigation bar so they keep visible and don't overlap with the bar you should read the documentation for topLayoutGuide and bottomLayoutGuide. From the documentation:

"[...] indicates the highest vertical extent for content that you don't want to appear behind a translucent or transparent UIKit bar (such as a status or navigation bar). [...]"

TopLayoutGuide

BottomLayoutGuide