In this tutorial we will create a view-based application that runs in landscape-mode only (i.e. the screen is wider than taller) vs. the usual portrait-mode (where the screen is taller than wider).

Create a New View-Based Application

Open Xcode



Create a new iPhone OS Project

Click File > New Project...



Make sure Application is selected under iPhone OS and then select View-Based Application.

Click Choose... and enter LandscapeOnlyViewBasedTutorial in the Save As: field and click Save.



If you want you can click the Build and Go toolbar button (making sure Simulator | Debug is selected from the left-most dropdown) and you’ll see that the iPhone Simulator now shows the application but it’s running in portrait mode. Time to start making some changes. Don’t forget to quit out of the iPhone Simulator.

Making Changes To Go From Portrait To Landscape

First we need to add a new key/value pair to your Info.plist file.

Open the Resources folder in your project’s Groups & Files. Right-click on the Info.plist file and choose Open As > Source Code File.



At the bottom of the file, just before the </dict> tag, add the following directive:

<key>UIInterfaceOrientation</key>
<string>UIInterfaceOrientationLandscapeRight</string>

so it looks like so:



Save your changes: File > Save or ⌘-S.

If you try running the app now, you’ll notice it seems to want to start in landscape-mode but switches to portrait immediately and there appears to be a status-bar artifact left on the right side of the view. So more work to do.

Next, open the Classes folder and then select the LandscapeOnlyViewBasedTutorialAppDelegate.m file.

Find the applicationDidFinishLaunching method and add the following after the [window makeKeyAndVisible]; line:

[[UIDevice currentDevice] setOrientation:UIInterfaceOrientationLandscapeRight];



Save your changes again.



If you tried building the project, you’ll notice a “warning: ‘UIDevice’ may not respond to ‘-setOrientation:’ message appears. You can ignore this. We are accessing an undocumented feature of UIDevice.

UPDATE: I’ve discovered that the setOrientation message for UIDevice is only needed to get the iPhone Simulator to start with the desired orientation. It can be left out if you are testing on a device and/or for your “final” build, if you want to avoid even this one warning.

Finally, select your LandscapeOnlyViewBasedTutorialViewController.m file and find the shouldAutorotateToInterfaceOrientation method.

Change the return line to be:

return (interfaceOrientation == UIInterfaceOrientationLandscapeRight);



Save your changes and then Build and Go. Ta da! It looks like we have a landscape-only application. You can verify this by using the Hardware menu item to Rotate Left and Rotate Right. You’ll see the display stays stuck in landscape-mode.



Now let’s add some more elements (quit the iPhone Simulator, if you haven’t already) to ensure we’re headed in the right direction.

Adding UI Elements To The View And Hope They’re Landscaped Too

Open the Resources folder and double-click the LandscapeOnlyViewBasedTutorialViewController.xib file.

This will open the .xib file in Interface Builder. From the window titled View, click the rotation arrow in the top-right corner to rotate the view to landscape-mode.



Drag a few UI elements from the Library (Tools > Library, if it’s not showing) into the view, namely a Navigation Bar (place it underneath the status bar), a Label (left-aligned under the Nav Bar), and a Round Rect Button (right-aligned in the bottom corner). Your view should look something like this:



(You will need to double-click the button to assign it a title.)

Once again, save your changes and run the app via the Build and Go button.



You’ll see that your new Navigation Bar, Label and Button appear as they were laid-out in the Interface Builder and even if you rotate the simulator they stay put. Success!

So, that’s how to create a view-based landscape-mode-only iPhone application.

What’s Next?

In the next couple of tutorials you will learn how to create a Utility Application that runs in landscape-only mode as well as create a view-based app without a status bar. Then another tutorial will show you how to wrap all these concepts into one landscape-mode-only, status-bar-less Utility Application. Stay tuned!

Tags: iPhone, iPhone SDK, Objective-C, Tutorial, Xcode, Interface Builder, Landscape, Landscape Only