List of figures – iPhone Application Development

List of figures

2.1. Choose the RSS icon for the template used in this chapter. Be sure to select only the ‘develop for mobile safari checkbox’ 18

2.2. Essential components of the Dashcode design screen, marked up using Apple’s terminology 20

2.3. This is the properties window. Here you can input the feed source and customize other attributes of the app 22

3.1. Choose the Podcast icon for the template used in this chapter. Be sure to select only the ‘develop for mobile safari checkbox’ 30

3.2. The app template shows access to three sample episodes of a podcast 34

3.3. The navigator section of the Dashcode window has the content element selected. By selecting this element the changes made in the Inspector tool will be made to the content area of the app 36

4.1. Choose the Browser icon for the template used in this chapter. Be sure to select only the ‘develop for mobile safari checkbox’ 44

4.2. This is the canvas view of the Browser template. It is the basic layout of many mobile websites 48

4.3. This is the browser window the app scrolls to after the ‘Item’ bar is tapped. Note that there are two layers of the browser app 50

4.4. This is what your canvas view will look like after you have dropped the QuickTime video element onto the second level of the browser 54

4.5. The lower portion of the Dashcode window shows the graphical representation of my data model from the previous section 59

4.6. By linking the relational source to your canvas you are creating a binding between the list of ‘Items’ and the data 60

4.7. The portion of your JSON array that is named ‘src’ is the one that gets linked to the QuickTime video element 61

4.8. You can double check the functionality of any app from the simulator. This is especially useful after linking a data source 62

5.1. Choose the Custom icon for the template used in this chapter. Be sure to select only the ‘develop for mobile safari checkbox’ 68

5.2. This is a blank template we are starting from. It is highly customizable and there are many uses beyond the work we will do in this chapter. In other words, this is a template to come back to and experiment with 73

5.3. This should look familiar. The layout resembles portions of the Browser app 75

5.4. This is what the simulator models after I incorporate the data from the JSON array 79

5.5. The JSON data relation is working properly but note that the text is displayed in a manner that still needs formatting changes to be read more easily 79

5.6. I decide to use a more streamlined look and feel in the next iteration of the app 83

5.7. Notice the stop locations now are more easily read by using a list rather than a box for text 83

6.1. Choose the Utility icon for the template used in this chapter. Be sure to select only the ‘develop for mobile safari checkbox’ 86

6.2. This is what the Utility template looks like before we customize it for our library 87

6.3. By the end of the chapter you will have an operational virtual suggestion box for the iPhone 88

6.4. In the bottom portion of the menu you will find the recipient field. This is where you will put in your library’s email account that you want the collections suggestion to go to 92

6.5. This is the reverse side of the app. If you choose to you can modify display attributes here or drop in additional parts 93

7.1. These are the Xcode templates. If you have made heavy use of iPhone apps in the past you should be able to identify which template any given app originated from 99

7.2. This is the Xcode (version 3.2.1) developer environment 102

7.3. The application settings menu of Xcode 106

8.1. This is the iPhone folder found in the downloaded files 116

8.2. The PhoneGap framework is a preconfigured set of files running inside of Xcode. It is essentially a template 117

A2.1. The home screen of the iPhone running the iOS 3. Icons are an important element of mobile design 149

A2.2. The keyboard interface of the iPhone. The user can rotate the device 180 degrees for a slightly larger layout 152