Share on Google+Share on Google+

UIView Image Background

In this tutorial, we are going to show you how to add image at background in UIView. There are two different ways of adding background image in your iphone application..
UIView Image Background

In this tutorial, we are going to show you how to add image at background in UIView. There are two different ways of adding background image in your iphone application..

1. Either you can set the UIView background image on "ViewDidLoad" or

2. You can take a UIImageView on your view and then set the image on it in interface builder.

But as per my experience setting image background on UIImageView is more reliable as it use separate UIImageView. However we'll illustrate both ways in this example.

1. Setting Image Background on UIView Create a new project "View Based application" assign name to your project and save it. On exploring the "Class" folder in your project, you'll find two different kind of files namely appDelegate.h /.m and ViewController.h (& .m). An iPhone application consists of two kind of files Delegate and controllers. Delegate files are required to delegate the work of diverse controllers in the application, and it is created by default by the application itself.

Where as in controllers we place our different outlets on it such as UIbuttons, UIpickerView etc.. in interface builder and connect them with certain actions and functions that are written into the code in ViewController files. That make it to perform certain actions on call.

Ok .. now, if you are setting the background image in UIView, you have nothing to do much. Just open the ViewController.m file and uncomment the ViewDidLoad method and write the given code in it.

self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"imageName.png"]];

ImageName is the name of the image that you wanted to set as the background. Please make sure that you have already added the image into you application "resources" folder. If not then follow the given steps to add image into the "Resources" folder. Right click on "Resources" -> Add -> Existing Files -> and browse and select the image file that you wanted to add... and then add it. if image file resides outside the application folder then please don't forget to check the "copy item into destination group's folder(if needed). As it is required to add the file into your project destination. Now, you can build the application to see the desired output.

UIView Background Image

Now, let's find out how you can add image as a background using UIImageView.

In your project open the "ViewController.xib" file and in Interface builder, open library -> look for UIImageView and drag it on the UIView and drop. Adjust the size equal to UIView and in Inspector "UIView" Select the name of the image.

Build your application... and you will find that it's showing the image in the background.

Note: if you have already placed so many controllers on it and now wanted to add the background image on UIImageView. You can still do it. What you need to do is drop the imageView on UIView and open layout from menu item on the top -> select "Send to Back". It will set it in the background.
Download Code


Posted on: April 14, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.


Advertisement null