views:

7980

answers:

5

Short of putting a UIWebView as the back-most layer in my nib file, how can I add a repeating background image to an iPhone app (like the corduroy look in the background of a grouped UITableView)?

Do I need to create an image that's the size of the iPhone's screen and manually repeat it using copy and paste?

+1  A: 

I think you probably want to create a Pattern. I'll update this answer when I find the relevant documentation.

Mark Bessey
+33  A: 

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]; 
}
Frank Schmitt
Wow i did not know about this. Great tip!
Lounges
Would you please provide a code snippet on how to use groupTableViewBackgroundColor? Thanks!
Frank Krueger
+1  A: 

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

CGContextDrawTiledImage
Dan
+1  A: 

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

CJCraft.com
+1  A: 

You should use colorWithPatternImage

Son Nguyen