Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I set the background of UITableView (the tableview style is "Grouped") to use an image?

Tags:

iphone

How can I set the background of UITableView (the tableview style is "Grouped") to use an image?

like image 368
ebaccount Avatar asked May 21 '09 20:05

ebaccount


6 Answers

In newer versions of the SDK, you'll need to set tableView.backgroundView if you want it to be transparent, try something like this:

tableView.backgroundColor = [UIColor clearColor];
tableView.opaque = NO;
tableView.backgroundView = nil;
like image 177
Sam Soffes Avatar answered Nov 20 '22 06:11

Sam Soffes


We need to do something about that plain background. We're going to use a PNG image and display it behind the UITableView.

  1. Prepare a PNG image. It should be either 320x460 (if you have the status bar visible in your app) or 320x480 (if you hide it).
  2. Drag it into XCode into the Resources folder and add to your project
  3. Load the NIB file containing your UITableView into Interface Builder
  4. Open the library (Tools> Library), switch to the Media tab, and drag the image to the View, create a new UIImageView.
  5. Use the inspector to move and resize the image so it's at X=0, Y=0, Width=320, Height=480
  6. Put the UIImageView behind the UITableView (Layout > Send to Back)
  7. Save, Build and Go!

Disappointingly, you won't be able to see your background. The UITableView's background is blocking us from seeing the UIImageView. There are three changes you need to make:

  1. In the Attributes Inspector, make sure the UITableView's "opaque" checkbox is unchecked!
  2. Set the UITableView's background color to transparent:

    tableView.backgroundColor = [UIColor clearColor];

I hope this helps and solves your problem. It has worked for me and I have yet to find a more elegant way to display a background image for a UITableView.

The advantage of my solution, in comparison with setting a background image directly on the UITableView, is that you can indent the table's content. I often wanted to do this to just show two or three table cells at the bottom of the screen.

like image 18
leviathan Avatar answered Nov 20 '22 06:11

leviathan


[tableView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"whatever.png"]]];
like image 12
Lounges Avatar answered Nov 20 '22 07:11

Lounges


tableView.backgroundView = nil; is enough. No need to set background color as Clear Color.

like image 9
Bharathi Avatar answered Nov 20 '22 07:11

Bharathi


One way would be to make the table view transparent (set the view's background to 0% opacity) and place a UIImageView behind the UITableView. Remember that transparent tables and table cells will not perform as well as opaque ones.

like image 2
pix0r Avatar answered Nov 20 '22 05:11

pix0r


In UI Builder the Background color has an "Other" choice. This brings up a color picker. The color picker has an opacity setting. If you set the Opacity of the COLOR to 0 it works, can't speak to performance.

like image 2
hasane Avatar answered Nov 20 '22 06:11

hasane