TableViewCell not displaying layout

Question

Here's a question about tableViewCell. I am trying my hand at table views for the first time and trying to get my head around reusable cells etc. I have managed to get it working to some extent. I have a tableView that lives on a child view controller which is its delegate and data source. Code for delegate:

#import "ChildViewController.h"

@interface ChildViewController ()

@property NSArray *titles;

@property NSArray *thumblenails;

@end

@implementation ChildViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.titles = [NSArray arrayWithObjects:@"Title 1", @"Title 2", @"Title 3", @"Title 4",nil];

    self.thumblenails = [NSArray arrayWithObjects:@"Image1", @"Image2", @"Image3", @"Image4", nil];

}


-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{

    return self.titles.count;
}

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

    SimpleTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];

    if (cell == nil)
    {
        NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"SimpleTableViewCell" owner:self options:nil];
        cell = [nib objectAtIndex:0];
    }

//  cell.textLabel.backgroundColor = [UIColor greenColor];

    cell.textLabel.text = [self.titles objectAtIndex:indexPath.row];
    cell.imageView.image = [UIImage imageNamed:[self.thumblenails objectAtIndex:indexPath.row]];

    return cell;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

I also have a SimpleTableViewCell.xib:

I have set the class on the identity inspector to SimpleTableViewCell and imported the SimpleTableViewCell.h file to my ChildViewController.h. I have also set the identifier to "cell" in the attributes inspector of the Table view cell, but here is the thing. As I am not getting the look I want for my cell, I have tried misspelling it and nothing has changed so clearly the identifier is not doing anything. When I run my app I get this:

So the array of images and titles are being loaded but not the actual cell size and labels that I set on the xib file for the cell. I have tried changing something in the cell, like the background color in the attributes inspector.

and on the xib it looks like this:

but when I run it:

I am guessing all this is because the cell identifier is not actually linked, but I thought I had done that in the line:

 SimpleTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];

Am I missing some important coding in here, linking something in the xib, or is it just a typo? any suggestions greatly appreciated.

//////////////////////////////////////////////////////////////////////UPDATE1////////////////////////////////////////////////////////////////////////

I have tried the second suggestion and the result is this:

So, hopefully this will throw some light into what I am doing wrong?

Also, I have corrected the original text, when I change the color to green it's using the attributes inspector.

Thanks for your help.

//////////////////////////////////////////////////////////////////////UPDATE2////////////////////////////////////////////////////////////////////////

I have removed the lines:

 cell.textLabel.text = [self.titles objectAtIndex:indexPath.row];
 cell.imageView.image = [UIImage imageNamed:[self.thumblenails objectAtIndex:indexPath.row]];

Also, added the code:

[self.tableView registerNib:[UINib nibWithNibName:@"SimpleTableCell" bundle:nil] forCellReuseIdentifier:@"cell"];

and the code:

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return [UIScreen mainScreen].bounds.size.width * (0.3);
}

Now my table looks like this:

So question now is how do I add the actual values of the original arrays of titles and images?

Answer 1

you should set the height of cell to get the exact same look in the nib file. use this delegate method to set height of cell.

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return [UIScreen mainScreen].bounds.size.width * (0.3);// 0.3 should be your aspect ratio for cell:
    // for cell.height/ cell.width in nib file.

}