Question

我有一个按钮，我想在其上方放置一个半透明的渐变叠加层。

Button(action: {
  print("Pressed")
}) {
  Text("Press me")
}
.overlay(
  LinearGradient(
    gradient: Gradient(colors: [.clear, Color.black.opacity(0.3)]),
    startPoint: .top,
    endPoint: .bottom
  ).disabled(true)
)

即使渐变具有disabled(true)，它仍然会吃掉触摸，并且不会将它们转发到实际按钮。 .allowsHitTesting(false)提供相同的结果。

有什么主意吗？

注意：我知道我可以将叠加层仅放置到Text("Press me")上，但我不想要它。（这只是展示问题的示例代码）

编辑：此问题已在Xcode 11.2中解决✅

Answer 1

以下代码可在Xcode 11.2 / iOS 13.2上运行

struct TestButtonWithOverlay: View {
    var body: some View {
        Button(action: {
            print("Pressed")
        }) {
            Text("Press me")
                .padding()
        }

        .overlay(
            LinearGradient(
                gradient: Gradient(colors: [.clear, Color.black.opacity(0.3)]),
                startPoint: .top,
                endPoint: .bottom
            )
            .allowsHitTesting(false) // !!! must be exactly here
        )
    }
}

struct TestButtonWithOverlay_Previews: PreviewProvider {
    static var previews: some View {
        TestButtonWithOverlay()
    }
}

Answer 2

在某些情况下，带有不透明度的 ZStack 可以解决某人的问题

这是我的想法：

ZStack(alignment: .topLeading) {
    Text("Placeholder)
    TextField()
      .opacity(0.8)
}

SwiftUI覆盖取消触摸

2 个答案: