Question

I want to make a table view in which i want to show some items or images ( 4 items in a row)For eg: If i have 7 images i want to show 4 in first row and 3 in next row and if i have 13 images then it should display like 4,4,4,1 in rows 1,2,3,4 respectively. I have achievd this but my problem is those images keep changing their position (shift from 1 to 3 row and vice versa) when i scroll the table view. Please tell me some way so that my images automatically adjust themselves 4 in a row and does not repeat if i scroll the table view.

My code is:

(array has 7 image-datas stored in it) 


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    return 93;
}

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

    return [array count];
}


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



    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Avi"];

    for (UIView *view in cell.contentView.subviews) {
        [view removeFromSuperview];
    }
    if (cell == nil)
    {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"Avi"] autorelease];
        cell.backgroundColor = [UIColor clearColor];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;

    }


    NSData *imageData;


        for(int i=0;i<4;i++){

        imageData=[array objectAtIndex:indexpath.row];

        UIButton *Button = [UIButton buttonWithType:UIButtonTypeCustom];
        Button.frame = CGRectMake(5+(i*77), 5, 77,85);
        [Button setBackgroundImage:[UIImage imageWithData:imageData] forState:UIControlStateNormal];


        [cell.contentView addSubview:Button];


    }

return cell;

Answer 1

So the code snippet you’ve posted isn’t particularly helpful, but this almost certainly is a case of not recycling your table view cells properly.

Table views ‘recycle’ their cells for efficiency and performance – when a cell scrolls out of view it is marked for recycling: when you next request a new cell you will be given a recycled cell if one is available (otherwise a new cell will be created).

If all your cells use the same layout, this isn’t a problem. However, if you adjust the layout of your cells (as you do) this can cause problems, because you might have set up a cell for 2-picture layout and have it be recycled for a 4-picture cell.

You have two options here: either take care to reset your cells as required (when you request a new cell reset all the view parameters you’ve created, which in your case would be by removing all the superviews), or create different cells with different identifiers for each of your layouts.

By the way, just looking at your current code it seems like you may want to consider some custom cells. Currently you add new images to the cell’s contents view, which means since you never remove them every time your cell gets recycled more and more and more images get added! It’s quite inefficient. Better to create a cell that has four image views ready to go, and you just assign the image property as required.