Living La Vida Landscape


Most iPhone classes presume you'll be using them in portrait orientation. Without going into actual code details (hopefully those will be allowed next week), I thought I'd review the basics of landscape interface math.

Screen size. Normally full-screen view frames occupy 320-by-480 pixels. When working with landscape views, swap that to 480-by-320 frames, wider than they are high.

Center your frames. The middle of the window (that is, the full-screen window) is at [240, 160] in portrait mode. Use the standard UIView setCenter: call to move your new view.

Apply an affine transform. To rotate your landscape view into position, apply a standard Core Graphics CGAffineTransform of 90 degrees, i.e. PI/2, or 3.141592f/2.0f. The rotation happens around the center of the view, which you've already positioned. The results are a 480-by-320 pixel view, perfectly centered.

When working with smaller views that take the status bar, navigation bars and toolbars into account, the math stays the same, even when the dimensions do not. For a status-bar enabled presentation, your portrait view should be 480-by-300 pixels in size, and your centering must adjust accordingly. Do not try to fit the 320-by-460 available portrait space when you're planning to display as a landscape.

You do, however, need work with the original coordinate system. UIWindow coordinates, which are usually set to the screen's bounds, actually line up with [0,0] onscreen. Bar-free UIViews, however, start at [0, 20] even though their local coordinate systems tell you that their top left corners are [0,0]. Which they are but only in their frame of reference. So if you want to add a landscape view, you need to account for those extra 20 pixels when setting your center point.

AddThis Social Bookmark Button
Comments (1)

1 Comments

Optimo said:

great quick-info
keep up the great work, looking forward to wwdc and your book ;)