SwiftUI 与 addArc 一起旋转在某些情况下无法正常工作

Question

Swift 5、iOS 13

使用 addArc 绘制一个半圆，然后使用 rotation3DEffect 旋转它。 在 y 轴上它工作得很好，但在 x 轴上似乎坏了。 我在这里做错什么了吗。

我得到了这个代码来工作。 但这是一个杂牌。

我想在 MyArc2 上使用 x 轴，而不必使用偏移+旋转效果。 第一张图片是您使用此代码看到的内容。

但是，如果我确实使用 x 轴，它不会正确绘制它。

import SwiftUI

struct ContentView: View {
  @State var turn:Double = 0
  var body: some View {
    return VStack {
    Image(systemName: "circle")
      .foregroundColor(Color.blue)
      .onTapGesture {
        withAnimation(.linear(duration: 36)) {
          self.turn = 360
       }
     }
     Globe2View(turn: $turn)
    } // VStack
  }
 }

 struct Globe2View: View {
  struct MyArc : Shape {
    func path(in rect: CGRect) -> Path {
    var p = Path()
    p.addArc(center: CGPoint(x: UIScreen.screenWidth/2, y:UIScreen.screenHeight/2), radius: 64, startAngle: .degrees(90), endAngle: .degrees(270), clockwise: true)
    return p
}
}
   struct MyArc2 : Shape {
   func path(in rect: CGRect) -> Path {
    var p = Path()
    p.addArc(center: CGPoint(x: UIScreen.screenWidth/2, y:UIScreen.screenHeight/2), radius: 64, startAngle: .degrees(90), endAngle: .degrees(270), clockwise: true)
  return p
  }
  }
  @Binding var turn:Double
  var body: some View {
    ZStack {
     ForEach(0..<12) { loop in
      MyArc()
        .stroke(Color.blue, lineWidth: 2)
        .rotation3DEffect(.degrees(self.turn + Double((loop * 30))), axis: (x: 0, y: -1, z: 0), anchor: UnitPoint.center, anchorZ: 0, perspective: 0)
  }
      ForEach(0..<12) { loop in
       MyArc2()
         .stroke(Color.green, lineWidth: 2)
        .rotation3DEffect(.degrees(self.turn + Double((loop * 30))), axis: (x: 0, y: -1, z: 0), anchor: UnitPoint.center, anchorZ: 0, perspective: 0)
        .rotationEffect(.degrees(90))
        .offset(x: 20, y: 20)
    }
  }
 }
}

如果我改变最后几行，它们看起来像这样......

struct MyArc2 : Shape {
func path(in rect: CGRect) -> Path {
    var p = Path()
    p.addArc(center: CGPoint(x: UIScreen.screenWidth/2, y:UIScreen.screenHeight/2), radius: 64, startAngle: .degrees(0), endAngle: .degrees(180), clockwise: true)
  return p
}
}

 ForEach(0..<12) { loop in
    MyArc2()
      .stroke(Color.green, lineWidth: 2)
      .rotation3DEffect(.degrees(self.turn + Double((loop * 30))), axis: (x: 1, y: 0, z: 0), anchor: UnitPoint.center, anchorZ: 0, perspective: 0)
//          .rotationEffect(.degrees(90))
//          .offset(x: 20, y: 20)
   }

Answer 1

目前尚不清楚为什么需要MyArc2 ，因为它是相同的，但以下内容通过简单的形状修复，按预期工作（在我看来）。

使用 Xcode 11.4 / iOS 13.4 测试

struct Globe2View: View {
    struct MyArc : Shape {
        func path(in rect: CGRect) -> Path {
            var p = Path()
            // used provided dynamic rect instead of hardcoded NSScreen
            p.addArc(center: CGPoint(x: rect.width/2, y:rect.height/2), radius: 64, startAngle: .degrees(90), endAngle: .degrees(270), clockwise: true)
            return p
        }
    }

    @Binding var turn:Double
    var body: some View {
        ZStack {
            ForEach(0..<12) { loop in
                MyArc()
                    .stroke(Color.blue, lineWidth: 2)
                    .rotation3DEffect(.degrees(self.turn + Double((loop * 30))), axis: (x: 0, y: -1, z: 0), anchor: UnitPoint.center, anchorZ: 0, perspective: 0)
            }
            ForEach(0..<12) { loop in
                MyArc()
                    .stroke(Color.green, lineWidth: 2)
                    .rotation3DEffect(.degrees(self.turn + Double((loop * 30))), axis: (x: 0, y: -1, z: 0), anchor: UnitPoint.center, anchorZ: 0, perspective: 0)
                    .rotationEffect(.degrees(90))
            }
        }
    }
}