Inset grouped table cells not aligned with large title

Please note that this problem seems to exist only on iPhones with the notch (iPhone 12, iPhone 13). On iPads and for example on iPhone 8 the problem is not there.

The horizontal insets for UITableView (and UICollectionView lists) using .insetGrouped come from the layoutMargins of the table/collection view.

Typically, when the table/collection view is the view of the UIViewController in the navigation controller, the systemMinimumLayoutMargins of that view controller will be applied to the table/collection view (due to the property viewRespectsSystemMinimumLayoutMargins), and this will result in proper alignment with content in the navigation bar (as that also follows the layout margins).

If your table/collection view is nested deeper within a view controller's view hierarchy (e.g. it is not the view itself, but a deeper subview), then it may not be receiving the expected layout margins. You should be able to make this work by enabling the preservesSuperviewLayoutMargins property on the table/collection view and any other superviews between it and the view controller's view.

But as a last resort, you can always manually set the layout margins on the table/collection view yourself to customize the insets as desired.

Frameworks Engineer's answer put me on the right track to find a fix.

The problem actually appears to be the value returned by layoutMargins. On an iPhone 12 and on an iPhone 8 the distance between the edge of the device and the large title is the same (16px).

The problem is that the value returned by layoutMargins.left is different on the two devices. On the iPhone 8 is 16px (the correct value to align the cells with the title) while on the iPhone 12 is 20px (4 pixels too much, causing the misalignment).

I tried to manually set the layoutMargins property and discovered that for some reason if you set the layoutMargins to zero then the issue disappears. After settings layoutMargins to zero then layoutMargins.left will return 16px on both devices, making a perfect alignment.

override func viewDidLoad() {
   super.viewDidLoad()
   tableView.layoutMargins = .zero
}

Screenshot