Centering Subviews in UITableViewCell within grouped TableView

Question

Hi Folks,

I'm trying to figure out how to place a subview to a custom UITableViewCell with centered position. As stated in the documentation (Customizing Cells) one should "...add subviews to the contentView property of the cell object or ...". As I noticed it works fine with UITableViewStylePlain. In UITableViewStyleGrouped tables, subviews can not be placed centered. They are shifted to the right hand side.

If the subview is added to UITableViewCell directly, it's fine with both modes. The same is true, if I subclass the UITableViewCell and load the cell from XIB.

Unfortunately, I can't upload screenshots. Can anyone help fix the issue? Or do I miss something vital, as the misalignment seems to match the dimension to be shrunken in grouped table.

Many thanks, El

- (UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *cellIdentifier1 = @"AddToCell";
static NSString *cellIdentifier2 = @"AddToContentView";
static NSString *aVeryLongLine = @"---------------------------------------------";
UITableViewCell *cell = nil;
if (indexPath.section == 0) {
    cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier1];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault 
                                       reuseIdentifier:cellIdentifier1] autorelease];

        CGRect frame = cell.frame;
        CGRect labelFrame = CGRectMake((frame.size.width-270)/2, (frame.size.height-40)/2, 270, 40);
        UILabel *label = [[UILabel alloc] initWithFrame:labelFrame];
        label.textAlignment = UITextAlignmentCenter;
        label.text = aVeryLongLine;
        [cell addSubview:label];
        [label release];
    }       
}
else if (indexPath.section == 1) {
    cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier2];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault 
                                       reuseIdentifier:cellIdentifier2] autorelease];

        CGRect frame = cell.contentView.frame;
        CGRect labelFrame = CGRectMake((frame.size.width-270)/2, (frame.size.height-40)/2, 270, 40);
        UILabel *label = [[UILabel alloc] initWithFrame:labelFrame];
        label.textAlignment = UITextAlignmentCenter;
        label.text = aVeryLongLine;
        [cell.contentView addSubview:label];
        [label release];
    }               
}
else {
}

return cell;

}

Answer 1

Did you check the frame's value, which come from cell.contentView.frame or cell.frame ?

When the cell is initialized with style and identity, it maybe have a CGZeroRect for his frame value.

Answer 2

Instances of UITableViewCell resize their content views under a number of circumstances (for example, when temporarily adding a delete button to allow the user to remove a row).

When cells are displayed in a grouped style table view, they're resized to provide a margin between the cells and the left and right edges of the table view. So for your subviews to stay positioned correctly, you'll need to set their autoresizing masks appropriately, something like this:

mySubview.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;

(or

[mySubview setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | 
                                UIViewAutoresizingFlexibleLeftMargin |
                                UIViewAutoresizingFlexibleRightMargin)];

for folks who prefer the old syntax.)