Widgets Home Grown in Austin

17 February 2009 @ 1pm

Development, iPhone, Mac

Sizing a UIView in Interface Builder

Interface Builder has come a long way since the early days of the iPhone SDK, a long way. However, there are still minor little anoyances that seem to creep up a little more often than I would like. One such anoyance that I recently uncovered was setting a custom size to a UIView when that view is associated with a UIViewController (a very common occurance).

In most cases a UIView is as large as the iPhone screen or smaller. But, in a few cases you may want a view that is larger than the normal iPhone screen size. Such a case might be when using the view within a UIScrollView which is a view that can manage subviews of arbitrary size. Interface Builder makes it exceedingly easy to configure views in the majority of cases but in special cases it falls flat and specifically in the case of the views size. The issue arises when a UIView is associated directly to a UIViewController.


As you can see from the screenshot the view labeled ‘SampleView’ is shown in IB as a subview to a view controller. Interface Builder seems to like to treat a UIViewController as some sort of pseudo view which can contain subviews. This is fine from a conceptual standpoint but this pseudo view has no controlls for size, location, etc. What ends up happening is that the views size is locked into a maximum size of 320 x 480. Again this is fine for most cases but falls short for those times when you want a view larger than is standard. What’s worse is that the Inspector for a UIView will allow you that change the width and height of a view attached in this way but in reality it is limited. You can see this when running your application. This behavior also makes it impossible to design anything but the top 480 pixels of your view in Interface Builder since it will only display a view design window that is fixed to what it thinks is the maximum size. In short attaching a view as a direct ‘subview’ of a view controller in Interface Builder can lead to some major limitations.

The solution to all of this is actually quite simple. Simply do not add your view as a subview to the view controllers ‘pseudo view’. Instead add your view as a standalone view in your NIB.


As you can see from the second screenshot my view is not listed as a subview of the view controller but rather as a standalone view in its own right. You can then associate your custom view with the ‘view’ outlet of the controller. Now, your view can be resized to any size that you want, you can design the entire view in IB, and it will show up with the correct size when you run your app.

1 Comment

Posted by
Chuck Han
14 March 2009 @ 10am

I think there’s still an interaction size limitation to a UIView, something in the 700s. When I put a UIButton in a large view, if it’s ‘below’ the 7xx mark, I get no interaction. Can you verify this?

Leave a Comment