UIScrollView is cut off from UITabBarController

Question

I have a UIScrollView that I place inside of a view (interface builder document .xib/.m/.h), however the lower portion of the UIScrollView is getting clipped and not showing the lower half of itself because of a UITabBarController I have.

I implemented the UITabBarController in the appdelegate file, so there is no UITabBarController that is seen in the XIB, however if I place another UITabBarController in the XIB to simulate the one i've already created, I will get two when I test the application.

Here is a snapshot of the UIScrollView outside of the view. This shows you the lower half of the UIScrollView...

_{(source: img-up.net )}

Here is a snapshot of the application running. Notice how the bottom half of the picture and notes are being cut off (Just barely though!)

_{(source: img-up.net )}

Basically--> How am I able to display the rest of the bottom of the scroll view? (picture/notes section) without it being cut off by the UITabBarController?

Answer 1

Keep in mind that the view from the nib is being automatically resized as it is placed inside the tab bar interface, so you want the scroll view to go along for the ride, and not stick out off the bottom of the resized view as it is doing now. Thus, you should either place the scroll view higher up in the view, or else use autolayout constraints (iOS 6) or autoresizing springs and struts (iOS 5) so that the bottom of the scroll view sticks to the bottom of the view, so that as the bottom moves up (the view gets shorter), the scroll view moves up with it.

(In the nib editor, you can ask the editor to simulate the presence of a tab bar [Simulated Metrics > Bottom Bar > Tab Bar], just to give yourself an idea of what the final size will be; but the right approach is to use appropriate constraints/autoresizing so that the view can be resized and its contents will still be visible. For one thing, that allows you adapt to both the iPhone 4 screen and the iPhone 5 screen.)

Answer 2

the quickest way is re-sizing your view in your xib to the content size of the UITabBarController, although the more efficient way is already answered. In the properties on the right you can set your main view to be "free form" and make it 320 by 392 or how ever big your section is.

If you want to view the app in both 4 inch and 3.5 inch, the littlest work is doing the answer above with the autoresizing mask

Answer 3

Look at the ScrollView Docs . If you look at the section about configuring size it explains that you should set up conent insets so that controller's don't cut off the content.

Seems like you would need to set the bottom contentInset with something like:

scrollView.contentSize=CGSizeMake(320,758); // Or whatever your content size is
scrollView.contentInset=UIEdgeInsetsMake(64.0,0.0,44.0,0.0);
// 64.0 being the top inset, and 44.0 being the bottom inset
// Set the bottom inset to the height of your tab bar or more

This will make sure your tab bar doesn't get obscured from your view.