时间戳

首页 > 解决方案 > 按钮出现在顶部但不可按下

swiftui - 按钮出现在顶部但不可按下

问题描述

public struct Frontside: View
{
  @Binding public var kanatext: String

  public var body: some View
  {
    ZStack{
      RoundedRectangle(cornerRadius: 25, style: .continuous)
        .foregroundColor(Color.red)
        .frame(width: 160, height: 160)
        .zIndex(0)

      Text(self.kanatext)
        .font(.title)
        .fontWeight(.black)
        .padding(50)
        .zIndex(1)

      VStack {
        Spacer()
        HStack {

          Button(action: {
            print("button pressed")
          }) {
            Image(systemName: "xmark.circle")
              .font(.title)
          }
          .mask(Circle())
          .opacity(0.4)



          Button(action: {
            print("button pressed")
          }) {
            Image(systemName: "checkmark.circle")
              .font(.title)
          }
          .mask(Circle())
          .opacity(0.4)
        }
      }
      .zIndex(2)
    }
  }
}

在上面的代码片段中，我使用 Zstack 将闪存卡的不同部分、背景、文本以及正确/错误按钮分层。最上层是按钮，它们显示正确，但由于某种原因，它们实际上不可按下。

标签： swiftui

解决方案

您是否尝试过使用 onTapGesture？这可能与您使用 ZStack 的事实有关。

尝试类似：

Image(systemName: "checkmark.circle")
    .font(.title)
    .onTapGesture {
       print("button pressed")
    }

在这种情况下，不需要将图像包装在按钮中。如果这不起作用，请添加onTapGesture到您的 VStack 并使其为空。

推荐阅读