Question

I have created Custom UITableViewCell using XIB file and got it working in UITableView. I have designed custom cell and it's subviews in portrait sizes but when I rotate device in landscap mode I want to resize cell and it's subviews. I have written following code for this but not sure why only one cell in visible cells get resized and rest stays same! Could someone please help me with the standard practice to resize custom cell and their subviews? Thanks.

#pragma mark - UITableView delegate methods

- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"CustomTableViewCellIdentifier";
    CustomTableViewCell *cell = (CustomTableViewCell*)[tv dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil) {
        // Load custom cell from NIB
        self.customTableViewCell = [[[NSBundle mainBundle] loadNibNamed:@"CustomTableViewCell" owner:self options:nil] objectAtIndex:0];
        cell = _customTableViewCell;
    }
    // Use cell
    ...
}

#pragma mark - Layout views

- (void)layoutForOrientation:(UIInterfaceOrientation)orientation {
    if (UIInterfaceOrientationIsPortrait(orientation))
        [self layoutPortraitViews];
    else
        [self layoutLandscapViews];
}

- (void)layoutLandscapViews {
    self.customTableViewCell.frame = CGRectMake(0, 0, 1024, 40);
    self.customTableViewCell.contentSize = CGSizeMake(1024, 40);
    self.customTableViewCell.cellBackgroundImageView.frame = CGRectMake(0, 0, 1024, 40);
    self.customTableViewCell.assetNameLabel.frame = CGRectMake(15, 0, 245, 20);
    self.customTableViewCell.assetTypeLabel.frame = CGRectMake(15, 20, 245, 20);
    self.customTableViewCell.assetImageView.frame = CGRectMake(265, 20, 120, 20);
    self.customTableViewCell.assetValueLabel.frame = CGRectMake(265, 20, 120, 20);

    [self.tableView reloadData];
}

- (void)layoutPortraitViews {
    self.customTableViewCell.frame = CGRectMake(0, 0, 768, 40);
    self.customTableViewCell.contentSize = CGSizeMake(768, 40);
    self.customTableViewCell.cellBackgroundImageView.frame = CGRectMake(0, 0, 768, 40);
    self.customTableViewCell.assetNameLabel.frame = CGRectMake(15, 0, 180, 20);
    self.customTableViewCell.assetTypeLabel.frame = CGRectMake(15, 20, 180, 20);
    self.customTableViewCell.assetImageView.frame = CGRectMake(200, 20, 90, 20);
    self.customTableViewCell.assetValueLabel.frame = CGRectMake(200, 20, 90, 20);

    [self.tableView reloadData];
}

[SOLUTION]

After little struggle got this working. Changing the size of cell and it's subviews not going to work as I have to handle orientation changes, keep reusing cell for performance, and visible cells changes when you rotate the device so couldn't figure out the solution using my first approach. Here is my another solution.

Here challenge is to handle orientations and custom cells together without compromising performance.

I have created two cell views in NIB, one for portrait and another for landscap.

Used two variables;

BOOL refreshing;
UIInterfaceOrientation currentOrientation;

From view will appear;

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    currentOrientation = [UIApplication sharedApplication].statusBarOrientation;
    [self layoutForOrientation:[UIApplication sharedApplication].statusBarOrientation];
}

From rotation delegates;

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
    refreshing = YES;
    currentOrientation = toInterfaceOrientation;
    [UIView animateWithDuration:duration animations:^{
        [self.tableView reloadData];
        [self layoutForOrientation:toInterfaceOrientation];
    }];
}

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation {
    refreshing = NO;
}

From tableview delegate;

- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"CustomTableViewCellIdentifier";
    CustomTableViewCell *cell = (CustomTableViewCell*)[tv dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil || refreshing)
     {
        if (UIInterfaceOrientationIsPortrait(currentOrientation))
            cell = [[[NSBundle mainBundle] loadNibNamed:@"CustomTableViewCell" owner:self options:nil] objectAtIndex:0];
         else 
            cell = [[[NSBundle mainBundle] loadNibNamed:@"CustomTableViewCell" owner:self options:nil] objectAtIndex:1];
    }

    //Use cell
}

...so this solution will reload cells only when orientation changed event happens. Happy coding :-)

Was it helpful?

Solution

Resizing a custom NIB xib cell may or may not provide the desirec UI on rotation.To make the task easier..create two UITableViewCell nibs

 if (!cell) {
            if(UIInterfaceOrientationIsLandscape(self.interfaceOrientation)) {
                [[NSBundle mainBundle] loadNibNamed:@"CustomTableViewCell-Landscape" owner:self options:nil];
            }else {
                [[NSBundle mainBundle] loadNibNamed:@"CustomTableViewCell" owner:self options:nil];
     }
}

Further call [tableView reloadData]; on orientation change

OTHER TIPS

I think this can be accomplished by the correct use of the autoresizing masks inside interface builder (or the new Auto Layout), instead of resizing the frame by code each time.

Because you self.customTableViewCell instant overwrite all time. so its return last object only.

you should write below code to resize your all UITableViewCells

for(UITableViewCell *cell in self.tableView.visibleCells)
{
     if([cell isKindOfClass:[UITableViewCell class]])
     {
          cell.frame = CGRectMake(0, 0, 1024, 40);
          cell.contentSize = CGSizeMake(1024, 40);
          cell.cellBackgroundImageView.frame = CGRectMake(0, 0, 1024, 40);
          cell.assetNameLabel.frame = CGRectMake(15, 0, 245, 20);
          cell.assetTypeLabel.frame = CGRectMake(15, 20, 245, 20);
          cell.assetImageView.frame = CGRectMake(265, 20, 120, 20);
          cell.assetValueLabel.frame = CGRectMake(265, 20, 120, 20);
     }
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top