Francis F
Francis F

Reputation: 3285

How to add background image to a UItable cell which is created dynamically in iOS

I'm creating a custom dynamic table which I used for creating a drop down on button click and it works fine. Now all the cells of table are plain white. I'm able to add background to table but having trouble adding background to the cell. This is a piece of code where I create the table. How will I add background image to my cell in this and also for its highlighted state? And is it also possible to customize its border?

- (void)createMenuTable {

    int totalItems = [self.menuArray count];

    float originalHeight = (MENU_CELL_HEIGHT * totalItems);

    float tableHeight = (originalHeight > self.frame.size.height)? (self.frame.size.height - (originalHeight > self.frame.size.height)): originalHeight;

    float xOrigin = 0;

    if (self.menuBarPosition == POSITION_RIGHT) {
        xOrigin = self.frame.size.width - MENU_TABLE_WIDTH;
    }

    CGRect tableFrame = CGRectMake(xOrigin, 0, MENU_TABLE_WIDTH, 0);
    menuOptionsTableView = [[UITableView alloc] initWithFrame:tableFrame style:UITableViewStylePlain];
    [menuOptionsTableView setDelegate:self];
    [menuOptionsTableView setDataSource:self];
    [menuOptionsTableView setAutoresizingMask:UIViewAutoresizingFlexibleHeight];
    [self addSubview:menuOptionsTableView];

    tableFrame.size.height = tableHeight;

    [UIView animateWithDuration:0.35 animations:^{
        menuOptionsTableView.frame = tableFrame;
    } completion:^(BOOL finished) {

    }];

}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *ParentCellIdentifier = @"MenuCell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ParentCellIdentifier];

    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ParentCellIdentifier];
        [cell setSelectionStyle:UITableViewCellSelectionStyleNone];
    }

    cell.textLabel.text = (self.menuArray)[indexPath.row];
    [cell.textLabel setTextAlignment:NSTextAlignmentCenter];
    [cell.textLabel setFont:MY_FONT_BOLD(14)];

    return cell;
}

Upvotes: 1

Views: 787

Answers (3)

Nirav Gadhiya
Nirav Gadhiya

Reputation: 6342

Add a line in your following method as shown bellow.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *ParentCellIdentifier = @"MenuCell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ParentCellIdentifier];

    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ParentCellIdentifier];
        [cell setSelectionStyle:UITableViewCellSelectionStyleNone];

        UIImageView * img = [[UIImageView alloc] initWithFrame:cell.contentView.bounds];
        [img setImage:[UIImage imageNamed:@"YOUR_IMAGE.PNG"]];
        [img setHighlightedImage:[UIImage imageNamed:@"YOUR_HIGHLIGHTED_IMAGE.PNG"]];
        [img setContentMode:UIViewContentModeScaleToFill];
        [cell.contentView addSubview:img];
        [img release];//FOR NON ARC

    }

    cell.textLabel.text = (self.menuArray)[indexPath.row];
    [cell.textLabel setTextAlignment:NSTextAlignmentCenter];
    [cell.textLabel setFont:MY_FONT_BOLD(14)];
    return cell;
}

This will help you easily.

Upvotes: 1

Bug
Bug

Reputation: 2562

Add this code on your cellForRowAtIndexPath:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{

   static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell;

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];


NSArray *cellSubs = cell.contentView.subviews;
for (int i = 0 ; i < [cellSubs count] ; i++)
{
    [[cellSubs objectAtIndex:i] removeFromSuperview];
}
    cell.textLable.text = "ABC";
    UIImageView *bgView = [[UIImageView alloc]initWithFrame:cell.backgroundView.frame];
        [bgView setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
        bgView.autoresizingMask = UIViewAutoresizingFlexibleWidth;
        bgView.image = [UIImage imageNamed:@"cell_bg.png"];
        [cell setBackgroundView:bgView];

     return cell;
}

Selected cell background

cell.selectionStyle = UITableViewCellSeparatorStyleSingleLine;
 UIView *bgColorView = [[UIView alloc] init];
    [bgColorView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"Selectedcell_bg.png"]]];
    [cell setSelectedBackgroundView:bgColorView];

EDIT

For macking round ract corner

First add --> QuartzCore.framework to your project & In your ViewController.m file -> Import header file

#import <QuartzCore/CALayer.h>

..

CALayer *cellImageLayer = bgView.layer;
    [cellImageLayer setCornerRadius:9];
    [cellImageLayer setMasksToBounds:YES];

Upvotes: 1

Mackey18
Mackey18

Reputation: 2352

try something like this.

UIView * bgView = [[UIView alloc] initWithFrame:correctFrame];
[bgView setBackgroundColor:[UIColor redColor]];
[cell addSubview:bgView];

Hope that works for you.

Mike.

Upvotes: 0

Related Questions