Блог

У меня есть ZStack изображение с изображением и кнопкой закрытия, накладывающейся на него. Я не могу сделать изображение открываемым с помощью кнопки, накладывающей его.

           ZStack(alignment: .topTrailing) {
                NetworkImage(url: article.imageURL)
                    .aspectRatio(contentMode: .fill)
                    .frame(width: UIScreen.main.bounds.width,
                           height: UIScreen.main.bounds.height * 0.5)
                    .scaleEffect(scrollViewContentOffset < 0 ?
                                    1   (-scrollViewContentOffset * 0.005)
                                    : 1,
                                 anchor: .bottom)
                
                Button(action: {
                    self.presentationMode.wrappedValue.dismiss()
                }){
                    Image(systemName: "xmark.circle.fill")
                        .foregroundColor(.init(white: 0.9)).padding([.top, .trailing])
                        .font(.system(size: topCloseButtonSize))
                        .offset(y: scrollViewContentOffset < 0 ?
                                    .extraLarge   scrollViewContentOffset :
                                    .extraLarge)
                }
            }
  

Я попытался добавить жест касания к самому изображению, но это отключает возможность нажатия на кнопку закрытия. Как я могу поддерживать ZStack в такте и иметь возможность нажимать как изображение, так и кнопку закрытия?

Попробуйте добавить onTapGesture модификатор к изображению сети (прямоугольник в коде beloew) — тогда, похоже, все работает так, как ожидалось. Я упростил сетевое изображение, чтобы использовать стандартный прямоугольник, но результаты нажатия должны быть одинаковыми. Протестировано на Xcode 12.1.

     ZStack(alignment: .topTrailing) {
        Rectangle()  // Use NetworkImage here - simplified to Rectangle for testing
            .aspectRatio(contentMode: .fill)
            .frame(width: UIScreen.main.bounds.width,
                   height: UIScreen.main.bounds.height * 0.5)
            .onTapGesture(count: 1, perform: {
                print("RECTANGLE TAPPED!")
            })
        Button(action: {
            print("CLOSE TAPPED")
        }){
            Image(systemName: "xmark.circle.fill")
                .foregroundColor(.init(white: 0.9)).padding([.top, .trailing])
        }
    }