Tuesday, April 7, 2015

iOS WebView insets

I have been battling some UI constraints on iOS and I have finally found a solution to how to solve this specific problem and just wanted to share.

My problem was that I had a UIWebView, which kept laying itself out underneath the NavigationBar in my controller. A quick fix would be to just set edges for the extended layout to none like so:

However, this will make you lose the nice effect of views scrolling behind the NavigationBar, for instance if the web page you are displaying scrolls.
Enter insets. As the name kind of indicates you add some spacing into your view. There is a property called AutomaticallyAdjustsScrollViewInsets. However, for some reason it does not do anything in my case, so I had to manually adjust the inset, which I did in ViewWillLayoutSubviews as in ViewDidLoad the TopLayoutGuide is not ready yet and will give you 0 for its Length. Basically this is what I had to do:

This tells both the UIWebView's internal ScrollView and the scroll bar that you want some space in the top equals to the height of the NavigationBar.