iOS 16 SwiftUI List Background

Question

With the new SwiftUI update in iOS 16 List no longer depends on UITableView . So the following snippet we used to set the List background color to .clear is now useless:

UITableView.appearance().backgroundColor = .clear

I saw that someone used introspect to solve the problem, but does anyone know of another maybe cleaner way to achieve the same behavior?

Also note that on macOS , the following works fine (Tested using Xcode 14 beta & macOS Ventura ):

extension NSTableView {
    open override func viewDidMoveToWindow() {
        super.viewDidMoveToWindow()
        backgroundColor = NSColor.clear
        enclosingScrollView!.drawsBackground = false
    }
}

Answer 1

iOS 16

Update: Xcode 14b3+

Just use new modifier:

    List {
        Text("Item 1")
        Text("Item 2")
        Text("Item 3")
    }
    .scrollContentBackground(Color.red)     // << here !!
//    .scrollContentBackground(Color.clear)     // << transparent !!
//    .scrollContentBackground(.hidden)     // << can be combined with above !!

Original

Now they use UICollectionView for backend, so an updated workaround is to change corresponding background colors:

Main part:

extension UICollectionReusableView {
    override open var backgroundColor: UIColor? {
        get { .clear }
        set { }

        // default separators use same color as background
        // so to have it same but new (say red) it can be
        // used as below, otherwise we just need custom separators
        // 
        // set { super.backgroundColor = .red }

    }
}

struct ContentView: View {
    init() {
        UICollectionView.appearance().backgroundColor = .clear
    }
//...

Test module on GitHub

Answer 2

iOS 16 adds a new API, View.scrollContentBackground , to customize background colors for scrollable View s including List . This was added in beta 3 ( release notes ).

List {
    Text("One")
    Text("Two")
    Text("Three")
}
.scrollContentBackground(.red)

Answer 3

For that purpose, I created a custom identifier that hides this custom scroll background.

struct ListBackgroundModifier: ViewModifier {

    @ViewBuilder
    func body(content: Content) -> some View {
        if #available(iOS 16.0, *) {
            content
                .scrollContentBackground(.hidden)
        } else {
            content
        }
    }
}

Usage:

List {
    ...
}
.modifier(ListBackgroundModifier())

Answer 4

As of Xcode 14.0.1 RC, the working code is

.scrollContentBackground(.hidden)
.background(.purple)