Question 68560 in IOS Swift Question posted in
The official documentation can be found here.

Transparent section header? – Ios swift

I’m creating a transparent List with transparent rows and section headers.

But as soon as the rows slide under the section header, it automatically features a background blur. I understand the sentiment, but would like to opt out.

enter image description here

Did anyone manage to hide it somehow? Leaving the section header background entirely transparent?

struct HeaderView: View {
        
    var body: some View {
        ZStack {
            Image("Map")
                .opacity(0.5)
            List {
                Section(
                    header: VStack {
                        Text("Section 1")
                            .font(.system(size: 40))
                            .frame(height: 60)
                    },
                    content: {
                        ForEach(1...20, id: .self) { eachRowIndex in
                            Text("Row (eachRowIndex)")
                                .listRowBackground(Color.clear)
                        }
                    }
                )
            }
            .listStyle(.plain)
            .padding(.top, 40)
        }
    }
}

Preferably iOS 13 SwiftUI, but I’m curious if there is anything to do with it in UIKit as well.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    For iOS 13, I needed to introspect UITableViewHeaderFooterView, and set backgroundView manually there (which needs an Introspect extension as well).

    struct ContentView: View {
    
    init() {
        UITableViewHeaderFooterView.appearance().backgroundView = UIView()
    }
    
    var body: some View {
        List {
            Section(
                header: HStack {
                    ...
                }
                .introspectTableViewHeaderFooterView {
                    $0.backgroundView = UIView()
                },
                
                content: {
                    ForEach { 
                        ...
                    }
                }
            )
        }
        .listStyle(.plain)
    }
}

    extension View {
    
    public func introspectTableViewHeaderFooterView(customize: @escaping (UITableViewHeaderFooterView) -> Void) -> some View {
        introspect(selector: TargetViewSelector.ancestorOrSiblingContaining, customize: customize)
    }
}

  2. 0

    Add empty view to UITableViewHeaderFooterView

    struct HeaderView: View {
    init() {
        UITableViewHeaderFooterView.appearance().backgroundView = UIView() // here
    }

// Other code
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search