Handling Arbitrary Shapes

The Multi-Touch interface allows developers to create interaction patterns based on simple taps, drags, and flicks. It also opens the door for more complex and engaging interfaces. We’ve seen ways to implement taps (single and multiple) and have explored dragging view objects around the screen. Those examples conceptually bind a fingertip to an object in space, creating an interface through the sense of touch, or haptic experience. There is another way of thinking of touches in relation to user interface objects that is a little more abstract, but nonetheless compelling to users.

The following example creates an interface that displays a grid of simple tiles, as shown in Figure 6-8. Each tile has two states: on and off. When a user taps a tile, it toggles the state and updates the view to use an image that correlates to that state. In addition to tapping, a user can drag over any number of tiles, toggling them as the touch moves in and out of the bounds of the tile.

Sample tile-based application

Figure 6-8. Sample tile-based application

Clicking the “Remove” button at the bottom of the screen removes all tiles in the selected state and triggers a short animation that repositions the remaining tiles:

// Board.h #import <UIKit/UIKit.h> #import "Tile.h" @interface Board : UIView { NSMutableArray *tiles; Tile *currentTile; BOOL hasTiles; } @property (nonatomic, retain) NSMutableArray *tiles; ...

Get Programming the iPhone User Experience now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.