React-Native：如何确定 MapView 当前是否正在跟踪用户位置？

Question

我正在构建一个使用 MapView 的 ReactNative iOS 应用程序。（实际上，现在我正在测试 react-native-maps，但我认为它们至少在很大程度上是相似的。）

我想实现一项类似于 Apple Maps.app 中的功能的 "center map around me" 功能。

在这两个屏幕截图的第一个中（抱歉尺寸），蓝色按钮突出显示并且地图正确定位在我当前位置周围：

在第二个屏幕截图中，我稍微平移了地图，使其不再以我的当前位置为中心，按钮也不再突出显示。

如果我点击按钮，地图会再次回到我的当前位置。

如何在我自己的应用程序中实现此按钮？

我看不到任何访问地图状态的方法（即它是否跟踪用户的位置）。

Answer 1

首先说

(Actually, right now I'm testing react-native-maps, but I think they're at least largely similar.)

不正确，因为他们使用不同的本机文件来处理 React 和 iOS/Android 之间的桥梁。

关于 react-native-maps，您可以使用 animateToCoordinate 方法对地图中心坐标进行动画处理，该方法记录在 here 中。为此，您应该为您的 MapView 提供一个引用（甚至可以使用 MapView.Animated class）。

基本上，您可以像这样声明您的地图

<MapView.Animated
  ref="map"
  showsUserLocation={true}
/>

然后创建一个方法：

centerOnUser(){
  navigator.geolocation.getCurrentPosition(
    (position) => {
      this.refs.map.refs.node.animateToCoordinate(position.coords)
    },
    (error) => alert(error.message),
    {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
  );
}

然后从您的按钮调用此方法。

React-Native：如何确定 MapView 当前是否正在跟踪用户位置？

React-Native: How to determine if MapView is currently tracking user location?

maps

ios

react-native