Repeating background image in native iPhone app

Apparently a UIColor is not necessarily a single color, but can be a pattern as well. Confusingly, this is not supported in Interface Builder.

Instead you set the backgroundColor of the view (say, in -viewDidLoad) with the convenience method +colorWithPatternImage: and pass it a UI Image. For Instance:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageNamed:@"gingham.png"]]; 
}

Of course, don't forget to add the image file to your application bundle.

There are also some built-in background pattern "colors":

  • groupTableViewBackgroundColor
  • viewFlipsideBackgroundColor

Because the are used globally across all iPhone apps, you incur the double-edged sword of an OS update updating the look and feel of your application (giving it a fresh new look that may or may not work right).

For instance:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor groupTableViewBackgroundColor]; 
}

You should have a look at the QuartzDemo iPhone example code from Apple, specifically QuartzImageDrawing.m. Should use the following method call.

CGContextDrawTiledImage

You can even have an animated tiled background images that move. :D

Apps Amuck has a simple tutorial that show you how to do this on their site.

31 Days of iPhone Apps - Day 16: World Tour


You should use colorWithPatternImage