从0°转到359°时，我该如何修复完全旋转的罗盘应用程序？

Question

我正在swiftUI中创建指南针应用程序。它可以工作，但是当我添加动画来移动指南针时，将出现以下行为：

例如，当它从5°定向转到350°时，它决定进行一次完整的转弯。指南针不是自然行为。

我的ContentView代码：

import SwiftUI
import CoreLocation

struct ContentView: View {

  var locationManager = CLLocationManager()
  @ObservedObject var location: LocationProvider = LocationProvider()
  @State var angle: CGFloat = 0

  var body: some View {
    GeometryReader { geometry in
      VStack {
        Rectangle()
          .frame(width: 10, height: 30)
          .background(Color(.red))
          .foregroundColor(Color(.clear))
        Spacer()
        Text(String(Double(self.location.currentHeading).stringWithoutZeroFraction) + "°")
          .font(.system(size: 40))
          .foregroundColor(Color(.black))
        Spacer()
      }
      .frame(width: 300, height: 300, alignment: .center)
      .border(Color(.black))
      .onReceive(self.location.heading) { heading in
        withAnimation(.easeInOut(duration: 0.2)) {
          self.angle = heading
        }
      }
      .modifier(RotationEffect(angle: self.angle))
    }.background(Color(.white))
  }
}

struct RotationEffect: GeometryEffect {
  var angle: CGFloat

  var animatableData: CGFloat {
    get { angle }
    set { angle = newValue }
  }

  func effectValue(size: CGSize) -> ProjectionTransform {
    return ProjectionTransform(
      CGAffineTransform(translationX: -150, y: -150)
        .concatenating(CGAffineTransform(rotationAngle: -CGFloat(angle.degreesToRadians)))
        .concatenating(CGAffineTransform(translationX: 150, y: 150))
    )
  }
}

public extension CGFloat {
  var degreesToRadians: CGFloat { return self * .pi / 180 }
  var radiansToDegrees: CGFloat { return self * 180 / .pi }
}

public extension Double {
  var degreesToRadians: Double { return Double(CGFloat(self).degreesToRadians) }
  var radiansToDegrees: Double { return Double(CGFloat(self).radiansToDegrees) }

  var stringWithoutZeroFraction: String {
    return truncatingRemainder(dividingBy: 1) == 0 ? String(format: "%.0f", self) : String(self)
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

在这里，我使用CGAffineTransform旋转带有矩阵动画的指南针来解决问题。我认为这会起作用，因为当我在UIKit中使用此方法时，该问题不存在。

我的LocationProvider代码：

import SwiftUI
import CoreLocation
import Combine

public class LocationProvider: NSObject, CLLocationManagerDelegate, ObservableObject {

  private let locationManager: CLLocationManager
  public let heading = PassthroughSubject<CGFloat, Never>()

  @Published var currentHeading: CGFloat {
    willSet {
      heading.send(newValue)
    }
  }

  public override init() {
    currentHeading = 0
    locationManager = CLLocationManager()
    super.init()
    locationManager.delegate = self
    locationManager.desiredAccuracy = kCLLocationAccuracyBest
    locationManager.startUpdatingHeading()
    locationManager.requestWhenInUseAuthorization()
  }

  public func updateHeading() {
    locationManager.startUpdatingHeading()
  }

  public func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
    DispatchQueue.main.async {
      self.currentHeading = CGFloat(newHeading.trueHeading)
    }
  }
}

我该如何解决这个问题？

Answer 1

更新：现在可以在多次旋转时使用。感谢 krjw 指出这个问题。

\n\n

您没有理由需要您的angle财产保持在 360\xc2\xb0 范围内。不要直接赋值heading，而是angle计算差值并相加。

\n\n

这是一个工作示例。在 ContentView 的属性之外body，添加以下函数：

\n\n

// If you ever need the current value of angle clamped to 0..<360,\n//   use clampAngle(self.angle)\nfunc clampAngle(_ angle: CGFloat) -> CGFloat {\n    var angle = angle\n    while angle < 0 {\n        angle += 360\n    }\n    return angle.truncatingRemainder(dividingBy: 360)\n}\n\n// Calculates the difference between heading and angle\nfunc angleDiff(to heading: CGFloat) -> CGFloat {\n    return (clampAngle(heading - self.angle) + 180).truncatingRemainder(dividingBy: 360) - 180\n}\n

\n\n

然后更改分配给的angle行

\n\n

self.angle += self.angleDiff(to: heading)\n

\n