Method 2: Creating Universal Applications
The previous method shows how you can modify the Targeted Device Family setting to create a single application that runs on both the iPhone and iPad. The challenge is adapting the UI of the application for each platform - you have to programmatically detect the device the application is running on and then modify the layout of the UI dynamically.
Apple recommends that you create a Universal application, one that targets both the iPhone and the iPad, with separate XIB files representing the UI for each platform. The following steps show you how you can create a Universal application.
Using Xcode, create a View-based Application (iPhone) project and name it Universal. Double-click on the UniversalViewController.xib file to edit it in Interface Builder.
Add a Label view to the View window and label as it as shown in Figure 9.
Populating the View window.
Press Command-R to test the application on the iPhone Simulator. You will see the application running on the iPhone Simulator (see Figure 10).
Running as an iPhone application.
Back in Xcode, expand on the Targets item and select the Universal item. Select Project'Upgrade Current Target for iPad… (see Figure 11).
Upgrading the project to iPad in Xcode.
In the dialog that appears, check the One Universal application option and click OK (see Figure 12).
Selecting the Universal application option
You will now see a folder named Resources-iPad containing an XIB file named MainWindow-iPad.xib (see Figure 13).
Examining the resources created by Xcode
Xcode will automatically create a copy of the MainWindow.xib and name it as MainWindow-iPad. By default, both MainWindow.xib and MainWindow-iPad will automatically load up UniversalViewController.xib when the application is started.
In addition, Xcode also modified the Targeted Device Family setting (located under the Deployment section of your target in Xcode) to "iPhone/iPad".
It is your responsibility to create separate XIB files for the user interface in iPhone and iPad.
Examine the Universal-Info.plist file located within the Resources folder. You will see that there is a key named Main nib file base name (iPad) with its value set to MainWindow-iPad (see Figure 14).
The new key in the plist file.
When the application is loaded in an iPhone or iPod touch, the MainWindow.xib file will be loaded. When the application is loaded in an iPad, the MainWindow-iPad.xib file will be loaded.
Right-click on the Resources-iPad folder and select Add'New File… (see Figure 15).
Adding new files to the Resources-iPad folder.
Select the Cocoa Touch Class item and then select the UIViewController subclass template (see Figure 16). Make sure that the Targeted for iPad and With XIB for user interface options are checked. Click Next.
Selecting the UIViewController subclass template.
Name the class as iPadUniversalViewController.m. The Resources-iPad folder should now look like Figure 17.
Examining the files added by Xcode.
Notice that there is now an XIB file together with its accompanying view controller class (the .h and .m files). Strictly speaking, the additional view controller class is not needed. The new XIB file (iPadUniversalViewController.xib) can be connected to the existing view controllers (UniversalViewController), which is currently connected to UniverslViewController.xib. Essentially, the two XIB files can be connected to the same view controller class.
Double-click on the iPadUniversalViewController.xib file to edit it in Interface Builder.
Populate the View window with the Label view and set it to display the string as shown in Figure 18.
Populating the View window.
Double-click the MainWindow-iPad.xib file to edit it in Interface Builder.
Select the "I Pad Universal View Controller" item and view its Identity Inspector window. Set its Class to iPadUniversalViewController (see Figure 19).
Configuring the MainWindow-iPad.xib to load the iPadUniversalViewController class.
With the same view controller selected, view its Attributes Inspector window and set its NIB Name attribute to iPadUniversalViewController (see Figure 20).
Changing the NIB name for the view controller.
In Xcode, select Simulator - 3.2 | Debug and press Command-R to test the application on the iPad Simulator. You will see the application as shown in Figure 21.
Running the application in the iPad Simulator.
If you now select the Simulator - 3.1.3 | Debug and press Command-R to test the application on the iPhone Simulator, you should see the application as shown in Figure 22.
Running the application in the iPhone Simulator.
The important thing about a Universal application is that you will need to create separate XIB files for the different platform - one for iPhone and one for iPad. Once this is done, the application itself will automatically detect whether it is running on the iPhone or the iPad and load the appropriate XIB file.
The end result of using this approach is that you only have one executable for your application.
In this article, you have seen how to port an existing iPhone application to support both the iPhone and the iPad. In general, the Universal application approach is the recommended one as it allows you to maintain just one code base that can target multiple platforms.