White background in table section header in iOS14

Question

This issue appeared after building to iOS14 with xcode12.

I have a section header with transparent background, on iOS14 it becomes white with new _UISystemBackgroundView added to the hierarchy.

score 21 · Accepted Answer · answered Oct 14 '20 at 14:09

iOS 14 comes with new two cell configurations:

Content configurations. UIContentConfiguration

As the name suggests, content configurations can help you manipulate the content of the cell like image, text, secondary text, layout metrics and behaviors.

Background configurations UIBackgroundConfiguration

can help with the manipulation of background color, visual effect, stroke, insets and corner radius. All cells will inherit a default background configuration even if we don’t specify one.

The Solution

To get rid of the default iOS14 white background you need to change the UITableViewCell or UITableViewHeaderFooterView backgroundConfiguration as follows

    // Add this code in your AppDelegate didFinishLauncingWithOptions
    // or you can change configuration of certain subclass using self. backgroundConfiguration = ...
    if #available(iOS 14.0, *) {
        var bgConfig = UIBackgroundConfiguration.listPlainCell()
        bgConfig.backgroundColor = UIColor.clear
        UITableViewHeaderFooterView.appearance().backgroundConfiguration = bgConfig
        //For cell use: UITableViewCell.appearance().backgroundConfiguration = bgConfig
    }

Read this article for more

Well, that wasn't obvious. Thank you! – Artem Zaytsev Jan 30 '23 at 13:35 — Artem Zaytsev, Jan 30 '23 at 13:35

score 9 · Answer 2 · answered Dec 04 '20 at 07:12

9

In your UITableViewHeaderFooterView / UITableViewCell custom class - override next method with implementation example:

Swift:

@available(iOS 14.0, *)
override func updateConfiguration(using state: UICellConfigurationState) {
    backgroundConfiguration = UIBackgroundConfiguration.clear()
}

Objective-C:

- (void)updateConfigurationUsingState:(UICellConfigurationState *)state {
    self.backgroundConfiguration = [UIBackgroundConfiguration clearConfiguration];
}

answered Dec 04 '20 at 07:12

Tommyizua

416
2
6

2

Good solution, Please note that state is kind of class `UIViewConfigurationState` in `UITableViewHeaderFooterView` class. – Husam Dec 20 '20 at 16:38

score 0 · Answer 3 · answered Dec 03 '20 at 15:43

Objective-C version of @Husam solution:

if (@available(iOS 14.0, *)) {
    UIBackgroundConfiguration *bgConfig = [UIBackgroundConfiguration listPlainCellConfiguration];
    bgConfig.backgroundColor = UIColor.clearColor;
    [UITableViewHeaderFooterView appearance].backgroundConfiguration = bgConfig;
}

score 0 · Answer 4 · answered Dec 17 '20 at 11:20

Use iOS 14's configuration based APIs may disable the functions of those legacy APIs (e.g. cell.textLabel, cell.detailTextLabel).

To prevent this system behavior, you can set a backgroundView (legacy API) to your header/footer/cell, and then set a custom backgroundColor for that view.

White background in table section header in iOS14

4 Answers4

The Solution