使用SwiftUI rotation3DEffect时是否可以隐藏背面? [英] Is it possible to hide backfaces when using SwiftUI rotation3DEffect?

问题描述

考虑以下简单示例:

  import SwiftUIstruct RotationExample:查看{var body:some View {ZStack {红色文字(我要隐藏的文字").font(.system(size:48))}.frame(宽度:大小，高度:大小).rotation3DEffect(角度(180)，轴:(x:0，y:1，z:0))}}struct RotationExample_Previews:PreviewProvider {静态var预览:某些视图{RotationExample()}} 

运行此代码时，文本以相反的方式显示.我以为在应用旋转时，将尊重图层(即，前景图层将在背景后面消失)

当背面旋转超过90度时，是否可以隐藏视图，或者以某种方式使图层在旋转过程中反转?我试过使用 .drawingGroup()并设置 .background 修饰符，但均无效.

解决方案

使用计算的属性，可以确定是否应显示该图层-这允许连续调整，如下所示，其中旋转是在拖动手势上进行的.旋转角度基于手势，然后不透明度取决于角度:

  import SwiftUIstruct RotationExample:查看{@State var转换:CGSize = .zerovar textOpacity:Double {let theta:Double = abs(angle.degrees).truncatingRemainder(dividingBy:360)return theta> = 90&&theta< = 270?0比1}var textOpacity:Double {返回abs(angle.degrees)> = 90吗?0比1}var body:some View {ZStack {红色文字(我要隐藏的文字").font(.system(size:48)).multilineTextAlignment(.center).opacity(textOpacity)}.frame(宽度:大小，高度:大小).rotation3DEffect(角度，轴:(x:0，y:1，z:0)).gesture(DragGesture().onChanged {值self.translation =价值.translation})}}struct RotationExample_Previews:PreviewProvider {静态var预览:某些视图{RotationExample()}} 

Consider this simple example:

import SwiftUI

struct RotationExample: View {

  var body: some View {
    ZStack {
      Color.red
      Text("Text I want to hide")
      .font(.system(size: 48))
    }
    .frame(width: size, height: size)
    .rotation3DEffect(Angle.degrees(180), axis: (x: 0, y:1, z: 0))
  }
}

struct RotationExample_Previews: PreviewProvider {
  static var previews: some View {
    RotationExample()
  }
}

When this code is run, the text is shown reversed. I thought when the rotation was applied, the layers would be respected (ie. the foreground layer would disappear behind the background)

Is it possible to hide a View when it is a backface rotated beyond 90 degrees, or to somehow get the layers to reverse during rotation? I have tried using .drawingGroup() and setting .background modifiers but neither worked.

解决方案

Using computed properties it's possible to determine whether the layer should be shown or not - this allows for continous adjustments like the following where the rotation is on a drag gesture. The angle of rotation is based on the gesture, then the opacity is based on the angle:

import SwiftUI

struct RotationExample: View {

  @State var translation: CGSize = .zero

  var textOpacity: Double {
    let theta: Double = abs(angle.degrees).truncatingRemainder(dividingBy: 360)
    return theta >= 90 && theta <= 270 ? 0 : 1
  }

  var textOpacity: Double {
    return abs(angle.degrees) >= 90 ? 0 : 1
  }

  var body: some View {
    ZStack {
      Color.red

      Text("Text I want to hide")
      .font(.system(size: 48))
      .multilineTextAlignment(.center)
      .opacity(textOpacity)
    }
    .frame(width: size, height: size)
    .rotation3DEffect(angle, axis: (x: 0, y:1, z: 0))
    .gesture(DragGesture()
      .onChanged { value in
        self.translation = value.translation
      })
  }
}

struct RotationExample_Previews: PreviewProvider {
  static var previews: some View {
    RotationExample()
  }
}

这篇关于使用SwiftUI rotation3DEffect时是否可以隐藏背面?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！