iPhone Game Development - Chris Craft [65]
FIGURE 5.5
AmuckRacer prototype
FIGURE 5.6
The About Us info screen
This About Us screen follows the pattern of previous info screens. Feel free to modify this screen to suit your purposes. We will use this info screen to do the following:
Show some information and a description for the game.
Show the player's current high score.
Provide a button that allows players to brag to their friends about their high score.
Tell people about this book and show them how to get it.
Tell people about other games in this book.
Let's write some code. Launch Xcode and choose File⇒New Project. From the New Project dialog box, click Application under iPhone OS on the left and then click Utility Application (see Figure 5.7).
FIGURE 5.7
Creating a new utility application
Click the Choose button to create a new utility application. You will want to save the new project to a location on your machine that you will remember. We recommend setting aside a special folder for all of your iPhone applications and giving it a straightforward name such as Apps, Projects, or Code. Once you have picked out your destination folder, save the new project with the name AmuckRacer.
You will now see the Xcode Project Explorer (Figure 5.8). On the left you will see a Groups & Files listing, to the right near the top you will see a file details listing, and to the left near the bottom you will see an editor window. You should first import any graphics that will be needed to create AmuckRacer.
In the Groups & Files listing, click the folder named Resources to expand it. Right-click on the Resources folder and choose Add⇒Existing Files. Now you will need to navigate your machine and find the AmuckRacer images that you downloaded earlier. Select each of these files and then click the Add button at the bottom right of the screen.
FIGURE 5.8
Xcode Project Explorer
You should now see a small dialog box with options for how to add the selected files to your project (see Figure 5.9). Be sure to click in the top check box labeled Copy items into destination group's folder (if needed) to copy the images to your project's location instead of just making a link to the file. This way if you copy the folder containing the project you will have all the related resource files as well. Choose Default for the Reference Type and Unicode (UTF-8) for the Text Encoding. Below this you should see two options, with Recursively create groups for any added folders selected. Finally, under Add To Targets, you should see the AmuckRacer project listed and selected.
Now that you have the required image files imported into the AmuckRacer project, you can begin laying out the images on the screens. You should still have the Resources folder open in Xcode. Double-click on the MainView.xib file to open this file in Interface Builder. It is here that you will design the AmuckRacer's user interface.
FIGURE 5.9
Add existing files dialog box
Start by choosing Tools⇒Library. Drag an Image View over to the Main View window. It should expand on its own to fill the entire window, as shown in Figure 5.10. This Image View will be the control that displays the game's default background. Drag another Image View over to the Main View window. This time, center the Image View in the bottom of window, as shown in Figure 5.11. As you move the Image View around, blue guidelines should become visible once you have the Image View near the bottom and in the center of the window. This Image View will become the player's car once you have assigned the correct images and written the right code for it.
To do this you need to assign the AmuckRacerBackground.png to your first Image View. Click on the original Image View to select it. From Xcode's Tools menu, choose Inspector. Be sure to select the left-most toolbar item named Image View Attributes. The AmuckRacerBackground.png is 320 pixels wide by 480 pixels tall, which matches the iPhone's screen size. Set the Image combo box to AmuckRacerBackground.png.
FIGURE 5.10
Adding the road's