0

我已经构建了一个包含图像、叠加层和 systemImage 的 ZStack。我想在用户点击此图像时打开一个工作表，但它仅在用户单击 ZStack 最底部的一个非常特定的点时才有效。有谁知道我怎样才能使这项工作？还有为什么这不起作用？我的代码：

NavigationView {
        VStack {
            VStack {
                ZStack {
                    if let image = pfimage {
                        Image (uiImage: image)
                            .resizable()
                            .frame(width: 100, height: 100)
                    } else {
                        Image ("testimage")
                            .resizable()
                            .frame(width: 100, height: 100)
                    }
                    Image(systemName: "photo")
                        .resizable()
                        .frame(width: 30, height: 25)
                        .foregroundColor(Color.white)
                    
                }
                .clipShape(Circle())
                .contentShape(Circle())
                .onTapGesture {
                    print("tap")
                    changepfsheet = true
                }
                
                Text("Displayname")
                    .padding(.top)
                    .foregroundColor(Color.white)
                    .font(.title3)
            }
            .frame(width: UIScreen.main.bounds.width, height: 225)
            .background(Color.red)
            
            HStack {
                Image(systemName: "person.2.circle")
                
                TextField("Enter newdisplayname", text: $newdisplayname)

            }
            .padding()
            .background(Color.gray.opacity(0.1))
            .cornerRadius(10)
            .padding(.horizontal)
            .padding(.top, 25)
                  
            Text("Change displayname")
            

            
            Spacer()
            

            HStack {

                Spacer()
                Text("Change password")
                    .foregroundColor(Color.white)
                Spacer()
                Image(systemName: "key")
                    .foregroundColor(Color.white)
            }
            .padding()
            .background(Color.red)
            .cornerRadius(15)
            .padding(.horizontal)
            .padding(.bottom, 5)
            
            HStack {
                Spacer()
                Text("Logout")
                Spacer()
            }
            .padding(.horizontal)
            .padding(.bottom, 20)
        }
        .edgesIgnoringSafeArea(.top)
        Spacer()
    }
    .navigationBarHidden(false)
    .navigationBarBackButtonHidden(false)
4

1 回答 1

1

您有干扰点击手势。相反，只需在ZStack. 现在你可以点击它的任何地方：

ZStack {
    Image(uiImage: image)
        .resizable()
        .frame(width: 100, height: 100)

    Color.black.opacity(0.5)
        .frame(width: 100, height: 100)

    Image(systemName: "photo")
        .resizable()
        .frame(width: 30, height: 25)
        .foregroundColor(.white)
}
.clipShape(Circle())
.contentShape(Circle())
.onTapGesture {
    print("tap")
    showsheet = true
}

我怀疑真正的问题是您使用NavigationView, 并将内容放在标题的后面。这意味着您无法单击标题所在的视图，即使它是空标题。您应该删除NavigationView( 因为您没有使用它) 或者不要忽略安全区域并NavigationView按照您应该做的那样使用 a 。

删除edgesIgnoringSafeArea(.top)使您的代码工作，因为内容将不再位于导航栏后面。

于 2021-08-12T09:56:51.747 回答