Toggle 2 different images in a tableView's cell

Question

I have a tableView that checks if a cell has being opened: if yes, it shows an empty cell (no image), if no, it shows a little image to state that the cell has not being read (opened) yet.

Now, i have the "favorites" function in my app, and i want to show a little image in the tableView that states that the cell is a favorite, so the user can quickly recognize those added to favorites right from the table.

I was trying to do, in cellForRowAtIndexPath method

NSDictionary *item = [rows objectAtIndex:indexPath.row];
cell.textLabel.text = [item objectForKey:@"name"];
if ([[item valueForKey:@"isRead"] boolValue] == NO) {
    cell.imageView.image = [UIImage imageNamed:@"unread.png"];
} else {
      if ([[item valueForKey:@"isFav"] boolValue] == YES){
          cell.imageView.image = [UIImage imageNamed:@"favorite.png"];
      }
      else{
          cell.imageView.image = nil;
      }
    cell.imageView.image = nil;
}

Where name , isRead , isFav are value took from a plist where i store all the data. Of course when the user opens a cell, the "unread" image goes away.

The problem is now that i want to show BOTH unread and favorites. In the code above, it shows only those unread.

How can i do to achieve this? I'm missing something stupid maybe!

Answer 1

Cell have only one imageView . Try this

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

    UIImageView *imageView1=[[UIImageView alloc]init];
    imageView1.frame=CGRectMake(0, 0,50,cell.frame.size.height);
    imageView1.tag=1000;
    [cell.contentView addSubview:imageView1];

    UIImageView *imageView2=[[UIImageView alloc]init];
    imageView2.frame=CGRectMake(cell.frame.size.width-50, 0, 50,cell.frame.size.height);
    imageView2.tag=2000;
    [cell.contentView addSubview:imageView2];


}


UIImageView *imageView=(UIImageView *)[cell.contentView viewWithTag:1000];
imageView.backgroundColor=[UIColor redColor];
imageView.image=[UIImage imageNamed:@"unread.png"];

UIImageView *imageView2=(UIImageView *)[cell.contentView viewWithTag:2000];
imageView2.backgroundColor=[UIColor greenColor];
imageView2.image=[UIImage imageNamed:@"favorite"];

Answer 2

WHy not just subclass UITableViewCell and lay it out the way you want? This is easy to do. I made ya a project that shows how to do this.

A brief summary:

Create a new class called MyTableViewCell or whatever.

MyTableViewCell.h:

#import <UIKit/UIKit.h>

@interface MyTableViewCell : UITableViewCell

@property (nonatomic, strong) IBOutlet UIImageView *image1;
@property (nonatomic, strong) IBOutlet UIImageView *image2;
@end

MyTableViewCell.m:

#import "MyTableViewCell.h"

@implementation MyTableViewCell
@synthesize image1, image2;
@end

Import that class in the VC that holds your TableView . Change the parent class of the TableViewCell to MyTableViewCell (in Interface Builder). Make sure the reuse identifier is named properly and then in cellForRowAtIndexPath :

static NSString *CellIdentifier = @"TwoImageCell";
MyTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

[cell.image1 setImage:[UIImage imageNamed:@"lion.png"]];
[cell.image2 setImage:[UIImage imageNamed:@"mtlion.png"]];

// Configure the cell...

return cell;

Project Here

Answer 3

The default implementation UITableViewCell doesn't have support for two images at once. You need to subclass the UITableViewCell and add your own UIImageView for one of the images you wish to display.

Answer 4

I solved thanks to the help of a dear friend, and i ended up doing something like

int state = 0;
    if ([[item valueForKey:@"isRead"] boolValue] == NO)
        state += 1;
    if ([[item valueForKey:@"isFav"] boolValue] == YES)
        state += 2;

    switch (state){
    case 1:
        cell.imageView.image = [UIImage imageNamed:@"unread.png"];
    break;
    case 2:
        cell.imageView.image = [UIImage imageNamed:@"favorite.png"];
    break;
    case 3:
        cell.imageView.image = [UIImage imageNamed:@"unreadAndFavorite.png"];
    break;
    default:
            cell.imageView.image = nil;
    break;
    }

Answer 5

To add two image views in a tableview cell. You have to implement the code below in cellForRowAtIndexPath (by default ow have one image view). In this you have to take two subviews and add them as content views.

-(UITableViewCell *)tableView:(UITableView *)tableViewL cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";


UITableViewCell *cell = [tableViewL dequeueReusableCellWithIdentifier:CellIdentifier];

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

    UIImageView *imageView1=[[UIImageView alloc]init];
    imageView1.frame=CGRectMake(0, 0,50,cell.frame.size.height);
    imageView1.tag=1000;
    [cell.contentView addSubview:imageView1];

    UIImageView *imageView2=[[UIImageView alloc]init];
    imageView2.frame=CGRectMake(cell.frame.size.width-50, 0, 50,cell.frame.size.height);
    imageView2.tag=2000;
    [cell.contentView addSubview:imageView2];


}


UIImageView *imageView=(UIImageView *)[cell.contentView viewWithTag:1000];
imageView.image=[UIImage imageNamed:@"myImage1.png"];

UIImageView *imageView2=(UIImageView *)[cell.contentView viewWithTag:2000];
imageView2.image=[UIImage imageNamed:@"myImage2.png"];   

 return cell;

}