react-native-maps 中的动画地图区域

【问题标题】：Animate map region in react-native-mapsreact-native-maps 中的动画地图区域
【发布时间】：2026-02-17 03:05:02
【问题描述】：

如何以最简单的方式为地图区域设置动画，以便我刚刚单击的标记位于屏幕的中心，在其他情况下也位于屏幕上半部分的中心屏幕（第 1 季度和第 2 季度之间）？

【问题讨论】：

标签： reactjs react-native react-native-maps

【解决方案1】：

你需要在你的状态下使用Animated.Region，例如：

 region: new Animated.Region({
        latitude:       lat,
        longitude:      lng,
        latitudeDelta:  0.01,
        longitudeDelta: 0.01,
 })

然后，在选择标记后（onSelect / onPress），您可以获取它的位置并将区域动画到它：

var {region} = this.state;
region.timing({
    latitude:  newLat, // selected marker lat
    longitude: newLong, // selected marker lng
  }).start();

在渲染方法中，记得使用 MapView.Animated 并将其与动画区域连接起来。

【讨论】：

非常感谢，但如果我没记错的话，那会将该位置与屏幕中心对齐，对吗？如果我想导航到该位置但将其设为屏幕上半部分的中心（而不是实际中心），是否可以这样做？原因是有一张底纸覆盖了地图的下半部分，因此需要标记的上半部分居中