SwiftUI 覆盖阻止列表滚动事件

Posted 2023-02-23

【中文标题】SwiftUI 覆盖阻止列表滚动事件

【英文标题】：SwiftUI overlay blocking List scroll events

【发布时间】：2020-05-28 09:15:14

【问题描述】：

我想在 SwiftUI 的列表顶部放置一个半透明的图像叠加层。 我试过这样的代码：

struct ContentView: View 
    var body: some View 
        List 
            Text("first")
            Text("second")
            Text("third")
        
        .overlay(
            Image(systemName: "hifispeaker")
                .resizable()
                .frame(width: 200, height: 200)
                .opacity(0.15)
        )
    

看起来和预期的一样，但是如果您将手指放在图像边界内，列表的滚动将不起作用（如果您尝试在图像外滚动，它会正常工作）

我尝试在不透明度之后添加.allowsHitTesting(false)，但它并没有改变任何东西。

使用ZStack 而不是overlay 也无济于事。我发现的唯一解决方法是使用ZStack，将图像放在列表后面并使列表半透明，但这不是我正在寻找的解决方案（它会稍微改变列表的颜色并导致一些动画问题）。

有没有办法让它工作？比如让图片在后台将事件传递给列表之类的。

【问题讨论】：

看起来像一个错误。实际上 .allowsHitTesting(false) 在应用覆盖时应该可以工作，但不适用于 List。

已知的 SwiftUI 错误（针对所有此类重叠） - 向 Apple 提交反馈，越多越好。

【参考方案1】：

这绝对看起来像是一个 SwiftUI 错误。我遇到了同样的问题，并且能够找到解决方法。

struct ContentView: View 
    var body: some View 
        List 
            Text("first")
            Text("second")
            Text("third")
        
        .overlay(
            ScrollView 
                Image(systemName: "hifispeaker")
                    .resizable()
                    .frame(width: 200, height: 200)
                    .opacity(0.15)
            
            .frame(width: 200, height: 200)
            .disabled(true)
        )
    

通过使用 .disabled(true) 修饰符将叠加层嵌入到 ScrollView 中，手势可以正确传递到列表并且不会阻止滚动。

【讨论】：

这真的很搞笑。

很奇怪。有人可以修复 SwiftUI 吗？