Using pattern images to set background views

A quick tip on how you can use a pattern to set the background of one or more views in an iOS app.

Creating the pattern

To illustrate the technique I have created a simple pattern (bluewhite.png) that is 100x100 pixels in size

The important thing is to ensure that the pattern repeats when it is tiled to fill the available area of the view.

Setting the background

Once you have the pattern image you can use it to create a UIColor object that is then used to set the background of a view. A convenient place to do that is in the viewDidLoad method of the viewController:

- (void)viewDidLoad {

  UIImage *patternImage = [UIImage imageNamed:@"bluewhite.png"];
  self.view.backgroundColor = [UIColor colorWithPatternImage:patternImage];
}

It is as easy as that, the pattern is tiled to fill the size of the view so you do not have to worry about the view orientation, or if the view is sized for the iPad or iPhone. The resulting view appears as follows:

Never miss a post!

iOS Size Classes Cheat Sheet

Subscribe and get my free iOS Size Classes Cheat Sheet

Success! Now check your email to confirm your subscription and download your free guide to iOS Size Classes.

There was an error submitting your subscription. Please try again.

Unsubscribe at any time.
No time to watch WWDC videos?

Sign up to get my iOS posts direct to your inbox and I will send you a free PDF of my iOS Size Classes Cheat Sheet.

OK! Check your inbox (or spam folder) for an email to confirm your details and download your free guide to iOS Size Classes.

There was an error submitting your subscription. Please try again.

Unsubscribe at any time.
Archives Categories