Incorrect difference in rendering accessory/disclosure indicator between iOS 12.x and iOS 13.x

Question

In an app I developed and sell in the App Store, when run, beginning under iOS 13, the background area of the disclosure accessory used in the app's custom table cells is not transparent, overlaying the content of the rest of the cell, truncating the right side of the image and in some cases truncating the text in the lower description area. I've "proven" that this change in the rendering of the disclosure accessory occurred going from iOS 12.x to iOS 13.x by loading a v12.4 simulator in Xcode and building the app using that. Running the app on the 12.4 simulator, the disclosure accessory appears correctly, as it has since the start of developing this app.

Below are screen caps that show how the disclosure area should and used to appear pre 13.x (first screen cap) and how it appears now starting in 13.x (second screen cap):

The closest SO post that I can find re this has not helped me resolve this: Altering the background color of cell.accessoryView and cell.editingAccessoryView

I have tried to add the following when I set up this custom cell to no desired effect: cell.accessoryView.backgroundColor = [UIColor clearColor];

Appreciate any guidance on how to resolve this.

Edits below in response to initial forum advice.

Note I haven't touch this code in many years so don't know why image and labels would have shifted. In any case I did try edit the image views and labels to align with borders of the cell config in the xib. Also tried resizing the image view and labels to not overlay the disclosure area but no change in app rendering. Tried View Debugger but all options are grayed out. Sorry, but I haven't dealt with this previously.

(Question: what is the gray vertical bar to the right of the disclosure icon indicating?)

Screen cap of .xib loaded into view controller cell with image view and label handles shown:

Code from view controller setting up table cell:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"CloudIndexCell";
    
    CloudIndexCell *cell = (CloudIndexCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) {
        
        if (cell == nil) {
            
            NSArray *topLevelObjects = [[NSBundle mainBundle]
                                        loadNibNamed:@"CloudIndexCell"
                                        owner:nil options:nil];
            for (id currentObject in topLevelObjects){
                if ([currentObject isKindOfClass:[UITableViewCell class]]) {
                    cell = (CloudIndexCell *) currentObject;
                    break;
                }
            }
        }
    }
    
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
        
        if (cell == nil) {
            
            NSArray *topLevelObjects = [[NSBundle mainBundle]
                                        loadNibNamed:@"CloudIndexCell~iPad"
                                        owner:nil options:nil];
            for (id currentObject in topLevelObjects){
                if ([currentObject isKindOfClass:[UITableViewCell class]]) {
                    cell = (CloudIndexCell *) currentObject;
                    break;
                }
            }
        }
    }
    
    if (cell == nil) {
        cell = [[CloudIndexCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier];
        
    }
    
    NSDictionary *sectionDict = [cloudsArray objectAtIndex:[indexPath section]];
    NSArray *rows = [sectionDict objectForKey:cloudsIndexViewControllerRowsKey];
    NSDictionary *rowDict = [rows objectAtIndex:[indexPath row]];
    
    NSString *cloudName = [rowDict objectForKey:cloudsIndexViewControllerCloudNameKey];
    NSString *cloudIndexDesc = [rowDict objectForKey:cloudsIndexViewControllerCloudIndexDescriptionKey];
    
    cell.cloudName.text = cloudName;
    cell.cloudDescText.text = cloudIndexDesc;
    
    if ([indexPath section] == 0) {
        cell.cloudDescBackground.backgroundColor = UIColorFromRGB(0x03AC03);
        
    }
    if ([indexPath section] == 1) {
        cell.cloudDescBackground.backgroundColor = UIColorFromRGB(0x7C4DD6);
    }
    if ([indexPath section] == 2) {
        cell.cloudDescBackground.backgroundColor = UIColorFromRGB(0xD79A00);
        
    }
    if ([indexPath section] == 3) {
        cell.cloudDescBackground.backgroundColor = UIColorFromRGB(0x666666); //[UIColor darkGrayColor];
    }
    
    cell.cloudImage.image = [UIImage imageNamed:[NSString stringWithFormat:@"%@_Index.png", cloudName]];
    
    return cell;
}

No problem with the disclosure accessory. It is transparent. It’s that the way the cell is laid out has changed. The edge of your image has been shifted. Use the View Debugger and you will see! Show your code for constructing the cell and we can try to help. — matt, Aug 14 '20 at 20:56
So it looks like the image view, at least, is pinned to the boundaries of the `contentView`. But the `contentView` does indeed contract when there's a disclosure accessory. So what's happening is expected. What I would suggest is that you make the image view be the cell's `backgroundView`. That way it will cover the whole background, which is what you want. — matt, Aug 15 '20 at 00:16
That helped to a degree. I implemented cell.backgroundView = cell.cloudImage; right before return cell; at the bottom of the code included in the post. That expanded the image display across the whole cell while still showing the disclosure icon which is great. But the cell.cloudDescText; and cell.cloudDescBackground assignments below the image, whose labels are also expanded, as is the image in the xib fully across the cell, are still truncated to the same degree as before. — larick, Aug 15 '20 at 00:52
Well they too would need to be in the `backgroundImage` if you want them to stretch across the whole cell. You need to assemble a background image consisting of a plain UIView that contains the image, the desc text, and the desc background, and set the `backgroundImage` to that view. — matt, Aug 15 '20 at 01:17
Alternatively, don't use a disclosure indicator! Just put your own indicator-like symbol at the right-center of the content view. All I'm saying is, work _with_ how the cell works, one way or another, instead of fighting it. — matt, Aug 15 '20 at 01:18
I'll work with your advice, particularly adding my own indicator to the content view. Thanks for your help. I'm still puzzled as to why this has become a problem now. I first wrote this app back in the iOS 5 (?) days (around 2010) through iOS 12.x and now it introduces this rendering in iOS 13.x. — larick, Aug 15 '20 at 01:40
Because of the way the content view now shrinks away from a disclosure indicator? — matt, Aug 15 '20 at 01:52

score 1 · Accepted Answer · answered Aug 15 '20 at 04:09

The content view now shrinks away from a disclosure indicator. The image view and other views are in the content view. So their right edge has moved left.

One choice is: don't use a disclosure indicator! Just put your own indicator-like symbol at the right-center of the content view. Then the content view will fill the cell.

Or else, use the clouds and other visual material as the cell background. You can assemble a background consisting of a plain UIView that contains the image, the desc text, and the desc background, and set the backgroundImage to that view.

Incorrect difference in rendering accessory/disclosure indicator between iOS 12.x and iOS 13.x

1 Answers1