【SwiftUI】opacity의 수수께끼

소개

SwiftUI에서는 View에 대해 .opacity(Double)로 불투명도를 지정할 수 있습니다.
인수 Double의 값이 0으로 투명, 1로 불투명, 0.5에서는 50%의 투과도가 됩니다.

공식 문서
htps : //로 ゔぇぺぺr. 아 ぇ. 코 m/두쿠멘들 온/수 f 츠이/ゔぃ에 w/오빠시 ty(_:)

다만, 투명할 때는, 탭했을 때에 동작시키는 onTapGesture가 반응하지 않게 되는 것을 발견했습니다.
그 존재가 지워져 버리는 것일까요?

검증

슬라이더로 샘플을 만들고 실험해 보았습니다.
버튼을 누르는 남성을 탭하면 위의 표시가 ON/OFF 전환되는 샘플입니다.
이 샘플은 다음과 같은 움직임을 보여주었습니다.

opacity가 0이 아닌 경우 ON/OFF가 전환됩니다.

opacity가 0 일 때 ON/OFF가 전환되지 않습니다

아래 소스 코드

ContentView.swift

struct ContentView: View {
  @State private var opacity: Double = 1.0
  @State private var isOn: Bool = false

  var body: some View {
    VStack {
      Spacer()

      Text(isOn ? "ON" : "OFF")
        .font(.title)
        .fontWeight(.semibold)
        .frame(width: 200, height: 100)
        .background(isOn ? Color.red : Color.green)
        .foregroundColor(isOn ? .white : .black)

      Spacer()

      Image("tapButtonImage")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .opacity(opacity)
        .frame(width: 200)
        .onTapGesture {
          isOn.toggle()
        }

      Slider(value: $opacity)
      Text("opacity: \(opacity)")

      Spacer()
    }
    .padding()
  }
}

opacity가 0이면 이미지의 존재 자체가 지워지고 있습니까? 라고 생각했습니다만, 화상이 존재하지 않게 되면, 스페이스가 채워져, 이하와 같은 배치가 될 것입니다.
그래서 프레임으로 존재하게 되어 있습니다.

　

탭 판정하고 싶은 경우

덧붙여서, 투명해도 탭 판정할 수 없는가라고 조사하고 있었는데, contentShape를 사용하면 반응하는 것을 알았습니다.
다음은 contentShape를 추가한 코드입니다.

ContentView.swift

Image("tapButtonImage")
  .resizable()
  .aspectRatio(contentMode: .fit)
  .opacity(opacity)
  .frame(width: 200)
  // contentShape追加
  .contentShape(Rectangle())
  .onTapGesture {
    isOn.toggle()
  }

이쪽을 참고로 했습니다.
h tps : // s t c ゔ ぇ rf ぉ w. 코 m / 쿠에 s 치온 s / 57258371 / 슈 f t-in c Rease-Ped 등

투명하게도 탭 판정시키고 싶은 경우, contentShape를 사용하면, 원하는 동작을 구현할 수 있습니다.

결론

투명 부분을 탭하여 동작시키고 싶다! 라고 생각 opacity를 0으로 해 코드를 쓴 것이 이 현상을 알아차리는 계기였습니다.
인수를 0.00001 등 한없이 0에 가깝게 하면, 인간에게는 투명하게 보이지만, 기계로부터는 투명하지 않다고 판정되기 때문에, 문제 없으면 문제 없습니다만. .
하지만 contentShape라는 해결책도 발견되었으므로, 만약 같은 현상으로 고통받고 있는 분의 참고가 되면 다행입니다.

끝까지 읽어 주셔서 감사합니다.