按钮下方的Swiftui Tap区域

Question

我的应用中我有一个view，该应用显示image是背景（通过banding），然后它具有一个按钮来下载图像和另一个是最喜欢的图像。

问题在于，当我在整个zstack上使用.ignoresafearea时，按钮上的点击区域移至按钮正文下方。我将图像缩放为适合和剪裁，然后尝试用填充方式将按钮向下移动，并且我尝试查看是否可以替代使整个ZSTACK 忽略没有运气的安全区域。

我还应该提到，我将图像作为背景.background zstack的顶部，但这也会影响按钮位置。

我还应该提到我对Swift是相对陌生的

struct photoDetail: View {
    
    let image: realPhoto
    @State var textControl: Bool
    
    init(image: realPhoto) {
        self.image = image
        self.textControl = image.favorited
    }
    
    var body: some View {
        ZStack {
            VStack(alignment: .leading) {
                Spacer()
                HStack {
                    Text("created by: \(image.username)")
                        .padding(5)
                        .foregroundColor(.white)
                        .background(Color(.gray).opacity(0.8))
                        .padding(.leading, 20)
                        .font(.system(size:20, weight: .semibold))
                        .padding(.bottom, 50)
                        .cornerRadius(4)
                    Spacer()
                }.padding(.bottom, 60)
                
            }
            VStack {
                
                HStack {
                    Spacer()
                    Button {
                        let imageSaver = ImageSaver()
                        imageSaver.writeToPhotoAlbum(image: UIImage(data: image.image)!)
                    } label: {
                        Image(systemName: "square.and.arrow.down")
                            .resizable()
                            .scaledToFit()
                            .frame(width: 20)
                            .padding(8)
                    }
                    Button {
                        favoriteToggle()
                    } label: {
                        Image(systemName: textControl == false || image.favorited == false ? "heart": "heart.fill")
                            .resizable()
                            .scaledToFit()
                            .frame(width: 25)
                            .padding(8)
                    }.padding(.trailing, 30)
                }.padding(.top, 100)
                Spacer()
            }
        }.onAppear() {
            self.textControl = image.favorited
        }.background(
            Image(uiImage: UIImage(data: image.image)!)
                .resizable()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
                .scaledToFill()
                .clipped()
        ).ignoresSafeArea()
    }
}

Answer 1

尝试将.contentshape（Rectangle（））添加到您的按钮。它应该限制可敲击区域到您的按钮视图