'Transparent section header?
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.
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.
Solution 1:[1]
Add empty view to UITableViewHeaderFooterView
struct HeaderView: View {
init() {
UITableViewHeaderFooterView.appearance().backgroundView = UIView() // here
}
// Other code
Solution 2:[2]
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)
}
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Raja Kishan |
| Solution 2 | Geri Borbás |

