List of Figures

Chapter 1. Introducing the iPhone

Figure 1.1. The iPhone supports two dramatically different views, landscape and portrait. Choosing between them is not just a question of which is easier to read, but also requires thinking about how much of each view is taken up by toolbars and other chrome. Mobile Safari is used here as an example of how much room the chrome takes up in each display.

Chapter 2. Web development or the SDK?

Figure 2.1. Though not identical, web programming (left) and SDK development (right) can produce similar output with similar underlying programming models.

Chapter 3. Redeveloping web pages for the iPhone

Figure 3.1. The iPhone’s viewport allows a much larger web page to be shown, scaled, in the iPhone’s display.

Figure 3.2. Gmail offers a different experience for iPhone users through a page that has been redisplayed to the point where it’s become an iPhone web app.

Figure 3.3. Facebook’s iPhone Optimized login screen makes everything big and easy to use, and gets rid of superfluous content.

Chapter 4. Advanced WebKit and textual web apps

Figure 4.1. New WebKit properties on the iPhone make your pages more attractive.

Figure 4.2. Our roundedbox transformed into a wackybox, which is rotated 30 degrees and translated 5 percent along each of the X and Y axes.

Figure 4.3. A thumbnail (left) is animated by a tap (middle), turning it into a full-page picture (right).

Figure 4.4. Data retrieved from a database can then be displayed.

Figure 4.5. Ready for touchdown! Four boxes set the scene for color dragging.

Chapter 5. Using iUI for web apps

Figure 5.1. The iPhone has a unique look and feel that should be emulated in iPhone web apps.

Figure 5.2. A list-based paradigm is easy to program in iUI, using just the <li> elements.

Figure 5.3. Groups help programs to organize lists into logical units.

Figure 5.4. A dialog allows users to conduct searches.

Figure 5.5. Toggles support the standard preference UI.

Chapter 6. Using Canvas for web apps

Figure 6.1. Any Canvas object maintains its own two-dimensional grid.

Figure 6.2. This simple banner was drawn with eight path commands.

Figure 6.3. Two simple arcs are drawn around a central dot.

Figure 6.4. The Bezier curves (left) were drawn using the depicted control points (right).

Figure 6.5. A stack of three rectangles are drawn one atop another.

Figure 6.6. Our shape function allows for a variety of rhombuses to be drawn.

Figure 6.7. Gradients allow for attractive coloring.

Figure 6.8. A circle clips the filled rectangle drawn after it.

Figure 6.9. Canvas allows for a wide variety of shapes to be created from a small set of primitives, as this combination of images, patterns, curves, and shapes shows.

Chapter 7. Building web apps with Dashcode

Figure 7.1. Dashcode includes a top bar (top) for important buttons, a navigator (left) for getting around your web page, and a canvas (right) to show off your content.

Figure 7.2. The inspector window allows you to modify individual Dashcode objects.

Figure 7.3. The Dashcode library gives you access to widgets, code, and your pictures.

Figure 7.4. You’ll realize how much work Dashcode does for you when you see all the files it creates, even for a simple program. This terminal window shows just some of the files created.

Figure 7.5. A simple gauge shows the ease-of-use of the Dashcode parts.

Figure 7.6. The Autoresize box tells a window where its subwindows should go when the window’s size changes, usually though an orientation event.

Figure 7.7. A few buttons can be easily added through Dashcode.

Figure 7.8. The Behavior inspector allows you to quickly assign functionality to buttons and other inputs.

Figure 7.9. The stackLayout object allows you to add additional views with a GUI.

Figure 7.10. A few buttons can make a tab bar.

Chapter 8. Debugging iPhone web pages

Figure 8.1. Client-side databases can be viewed in Safari.

Figure 8.2. Firefox (left) and Safari (right) both include JavaScript error consoles that you can use to debug Canvas and any other JavaScript work you’re doing.

Figure 8.3. The Firebug console allows you to type in JavaScript functions, making Canvas even simpler.

Chapter 9. SDK programming for web developers

Figure 9.1. Inheritance and messaging combine to form an intricate network of objects in object-oriented programming.

Figure 9.2. The MVC model covers how user input and other changes affect your program’s design.

Chapter 10. Learning Objective-C and the iPhone OS

Figure 10.1. Clicking iPhone SDK will start your installation.

Figure 10.2. The SDK includes Xcode (left), Interface Builder (center), and the iPhone Simulator (right).

Figure 10.3. Headers and source code files each contain distinctive parts of your Objective-C classes.

Figure 10.4. Apple provides you with four layers of frameworks to use when writing iPhone SDK programs.

Figure 10.5. This hierarchy shows just a small selection of the classes available in the iPhone OS.

Figure 10.6. A window contains one or more view controllers or views under the iPhone OS.

Chapter 11. Using Xcode

Figure 11.1. Xcode’s main project window shows you all your files and also allows you to quickly view them.

Figure 11.2. Hello, World! is easy to program on the iPhone using the SDK.

Figure 11.3. A brand-new class makes it easy to display a URL and call it up on our screen; what you’ve created is the first step in building a web browser.

Figure 11.4. By using the appropriate templates, you can lay out a nav bar (left), a tab bar (middle), or a flipside function (right) before you start writing any code.

Chapter 12. Using Interface Builder

Figure 12.1. The nib document window (middle top) and the main display window (middle bottom) are two of the fundamental displays in Interface Builder. The Library (right) also comes up when you start Interface Builder. You need to call up the inspector (left) by hand.

Figure 12.2. Through outlets and events, you can export Interface Builder information to different parts of your Xcode.

Figure 12.3. A few seconds of work results in three objects ready for use in Interface Builder.

Figure 12.4. The Attributes tab shows all of an item’s basic information.

Figure 12.5. You can change an object’s positioning and size from the Size tab.

Figure 12.6. The Identity tab contains some deeper stuff that’s mostly beyond the needs of this simple example program.

Figure 12.7. Combining graphics and text can be hard in some programming languages, but under the SDK it can be done entirely with Interface Builder.

Figure 12.8. You need to drag and release to build a connection in Interface Builder.

Figure 12.9. You can Ctrl-click to access Connections panels if you want to see multiple connections at the same time.

Figure 12.10. An image, a label, and a dynamic web view are put together in Interface Builder with only a single line of Xcode required (plus a couple of declarations).

Chapter 13. Creating basic view controllers

Figure 13.1. A bare view controller shows view-controlling at its simplest: it sits below one object and above another.

Figure 13.2. To hook up a new .xib file to a view controller, enter its name in the view controller’s attributes under NIB Name.

Figure 13.3. Interface Builder will graphically depict exactly what autoresizing looks like.

Figure 13.4. A table view controller controls a table view and its collection of cells.

Figure 13.5. A look at the connections automatically created for a controller’s table view.

Figure 13.6. Section headers can improve the usability of table views.

Chapter 14. Monitoring events and actions

Figure 14.1. Events on the iPhone are initially sent to the first responder, but then travel up the responder chain until someone accepts them.

Figure 14.2. UIEvent objects contain a set of related UITouch objects.

Figure 14.3. Two UITextFields (one of them hidden) and one UILabel, all set against an aluminum-colored background, complete the object creation we’ll need for our eventreporter project.

Figure 14.4. Working primarily in Interface Builder, we’ve connected up six objects that we’ll be using to report iPhone events.

Figure 14.5. Your event responder uses a few graphical elements to report events as they occur.

Figure 14.6. UIControl objects take standard touch events and turn them into actions that are dispatched by UIApplication.

Figure 14.7. With an IBAction, there’s no code, just a link.

Figure 14.8. A heavily connected view controller will be a pretty normal sight as you gain experience in creating objects in Interface Builder.

Figure 14.9. A text field and a slider conspire to set the color of the iPhone’s background.

Chapter 15. Creating advanced view controllers

Figure 15.1. A collection of six objects (at minimum) is required to create a functioning tab bar controller.

Figure 15.2. Just dragging a tab bar controller to the nib display window creates the whole tab bar interface.

Figure 15.3. You can customize tab bars to make navigation clear and simple.

Figure 15.4. The navigation controller will contain at least four objects, and may be built into a complex web of interconnections.

Figure 15.5. The navigation controller template contains two .xib files, one for the main view (left) and one for what appears inside the controller (right).

Figure 15.6. With a few simple commands, a navigation controller’s setup is largely automated.

Figure 15.7. Several objects are created in a flipside controller.

Figure 15.8. Objects in Interface Builder can connect to a variety of different files.

Chapter 16. Data: actions, preferences, files, SQLite, and addresses

Figure 16.1. This preferences page was built from scratch on the back of a flipside controller.

Figure 16.2. This look at system settings reveals some of Root.plist’s PreferenceSpecifiers.

Figure 16.3. This display shows how PSTitleValueSpecifier and a PSMultiValueSpecifier look in Xcode.

Figure 16.4. In order, a Group, a TextField, another Group, a Switch, a TitleValue, a MultiValue, a ChildPane, a third Group, and a Slider.

Figure 16.5. Compiled programs contain several directories full of files.

Figure 16.6. A keyboard fills the screen of the Filesaver.

Figure 16.7. This menu was created directly from a database.

Figure 16.8. The Address Book framework gives you low-level access to contact information.

Figure 16.9. A people-picker view controller

Chapter 17. Positioning: accelerometers and location

Figure 17.1. The accelerometers in the iPhone measure in three-dimensional space.

Figure 17.2. The Accelerometer Graph shows movement in all three directions.

Figure 17.3. This simple utility shows off locations and distance.

Figure 17.4. An altitude program measures how high you’ve climbed on a mountain of your choice.

Chapter 18. Media: images and sounds

Figure 18.1. Images can be shown in UIImageViews or in UIViews.

Figure 18.2. The image picker is another preprogrammed controller for your use.

Figure 18.3. The collager in use displays many photos simultaneously.

Figure 18.4. The media player doesn’t integrate music well.

Figure 18.5. A pipeline moves audio from an input device to its output for playback.

Chapter 19. Graphics: Quartz, Core Animation, and OpenGL

Figure 19.1. The iPhone does abstract art.

Figure 19.2. As these variant transformations show, order matters. The left picture is untransformed; the middle one is translated and then rotated; and the right one is rotated and then translated.

Figure 19.3. An example of a clipping path in use. The unclipped image is on the left, and the clipped image is on the right.

Figure 19.4. You can change a UIImage without showing it to the user.

Figure 19.5. Photodraw can place drawings on pictures.

Figure 19.6. A jet approaches, thanks to Core Animation.

Chapter 20. The web: web views and internet protocols

Figure 20.1. internet protocols are arranged in a hierarchy.

Figure 20.2. The thumbnail program removes web views that fail to load.

Figure 20.3. RSS feeds can easily be placed in table views.

Figure 20.4. Complex SDK programs can chain multiple classes.

Figure 10.5. It’s easy to extract data using TouchJSON.