Custom Background in UITableView?

Discussion in 'iOS Programming' started by ArtOfWarfare, Aug 23, 2011.

  1. ArtOfWarfare macrumors G3


    Nov 26, 2007
    I'm trying to modify the background of the cells in my UITableView to be an image.

    Inside of (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

    I have these few lines of code:

    cell.backgroundColor = [UIColor clearColor];
    UIImageView *background = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"friendPickBackdrop"]];
    background.frame = CGRectMake(0, 0, 262, 45);
    cell.backgroundView = background;
    cell.opaque = NO;
    cell.backgroundView.opaque = NO;
    cell.textLabel.opaque = NO;
    cell.textLabel.backgroundColor = [UIColor clearColor];
    What it looks like right now is attached. The list of issues with it are...

    1.) Why is the background of the cell only drawing on the edges? Why isn't the background in the middle of the cell?
    2.) How would I change the color of everything that's visible when the user scrolls up past "ArtOfWarfare"?
    3.) What should I do with the empty cells? I don't really like the lines between them...

    Attached Files:

  2. jnoxx macrumors 65816


    Dec 29, 2010
    Aartselaar // Antwerp // Belgium
    tried doing this.
    1. Create a fully custom XIB for Cell's (which mostly looks alot cleaner).
    2. Or try to set an image as backgroundview with the pattern like this
    cell.backgroundColor = [UIColor colorwithimagePattern:@"xx.png"];
    Code isn't typed correctly, it's top of my head, but it's something like that.
    Don't know how to answer on your other questions top of my head.
  3. dantastic macrumors 6502a


    Jan 21, 2011
    The best way here to proceed is to

    1) Set all parameters of the tableview to be transparent, off the top of my head I can't remember all.
    2) Turn off the line divider between cells.
    3) roll your own xib for the cells and you can stick your own image in the background then.

    In this partuclar case you will probably want to disable scrolling and also set the exact height of the tableview according to the number of buttons you are going to use.

    For this kind of stuff the default tableviewcell is not particularly useful but luckily it's really simple creating your own.
  4. ethical macrumors 68000

    Dec 22, 2007
    You shouldn't need to set up an XIB for a cell just to set its background image. Try this (I put mine in viewDidLoad - not sure if that's the right place or not but it works for me):

    tableView.separatorColor = [UIColor clearColor];
    // Set the background image to what you want the user to see below/above the rows with content (i.e when they scroll up past ArtOfWarfare)	
    tableView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"bg.png"]];

    Try the willDisplayCell method for setting the background image of cells:

    - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    // Sets the background of the cells
    cell.backgroundColor = [UIColour colourWithPatternImage:[UIImage imageNamed:@"cell_bg.png"]];

Share This Page