SwiftUI Map用户朝向标注未显示，需配置还是自定义？

问题描述 #

我通过以下SwiftUI代码创建Map视图，已经能显示用户位置的蓝色圆点，但无法显示用户朝向的半透明蓝色扇形标注（苹果地图默认的那种）。想知道有没有简单的配置或函数调用就能显示这个标注，还是必须自定义？

视图代码 #

@State private var mapCameraPosition: MapCameraPosition = .userLocation(followsHeading: true, fallback: .automatic)

var body: some View {
    ZStack {
        Map(position: $mapCameraPosition) {
            UserAnnotation()
        }
    }
}

LocationManager代码 #

class LocationManager: NSObject, ObservableObject, CLLocationManagerDelegate {
    let locationManager = CLLocationManager()
    @Published var currentLocation: CLLocation?
    @Published var currentHeading: CLHeading?

    override init() {
        super.init()
        locationManager.delegate = self
        locationManager.desiredAccuracy = kCLLocationAccuracyBest
        locationManager.requestWhenInUseAuthorization()
        locationManager.startUpdatingLocation()
        locationManager.startUpdatingHeading()
    }

    func locationManager(_ manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {
        currentLocation = locations.last
    }

    func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
        currentHeading = newHeading
    }
}

解决方案 #

不需要自定义标注，只需调整两处配置就能让系统默认的朝向扇形显示：

• 完善权限与航向设置
  首先确保Info.plist中添加了必要权限键：

  • NSLocationWhenInUseUsageDescription：位置权限说明文本
  • NSMotionUsageDescription：设备方向权限说明文本
    然后在LocationManager的初始化方法中，添加航向方向配置：

  override init() {
      super.init()
      locationManager.delegate = self
      locationManager.desiredAccuracy = kCLLocationAccuracyBest
      locationManager.requestWhenInUseAuthorization()
      // 设置航向读取的屏幕方向，根据你的App需求调整
      locationManager.headingOrientation = .portrait
      locationManager.startUpdatingLocation()
      locationManager.startUpdatingHeading()
  }
  

• 启用Map的用户跟踪模式
  移除手动添加的UserAnnotation()，改用Map的userTrackingMode绑定，让系统自动处理位置和航向显示：

  @State private var mapCameraPosition: MapCameraPosition = .userLocation(followsHeading: true, fallback: .automatic)
  @State private var userTrackingMode: MapUserTrackingMode = .followWithHeading
  
  var body: some View {
      ZStack {
          Map(position: $mapCameraPosition, userTrackingMode: $userTrackingMode) {
              // 这里不需要手动添加UserAnnotation
          }
      }
  }
  

• 验证航向数据
  可以在didUpdateHeading中添加日志，确认是否获取到有效航向数据：

  func locationManager(_ manager: CLLocationManager, didUpdateHeading newHeading: CLHeading) {
      currentHeading = newHeading
      print("当前真实航向：\(newHeading.trueHeading)")
  }
  

  注意：模拟器需要通过Debug → Location → Custom Location或Debug → Location → Route来模拟航向，真机则需要确保设备的方向传感器正常工作。

内容的提问来源于stack exchange，提问作者Alan shen