在react-native中，使用react-native-maps，如何以编程方式结束标记拖动？

Question

我的应用程序显示一个带有多边形边界和中间有一个标记的地图。标记是可拖动的。当应用程序检测到标记已被拖动到边界之一时，我想以编程方式停止拖动。看起来这应该很简单，但我一直不知道该怎么做。例如，我应该能够调用 onDragEnd(event) 或 DragEnd(event) 之类的东西。

Answer 1

首先，我为标记位置在边界之外时创建了一个状态变量：

  const [outside, setOutside] = useState(false);

然后，在 onDragStart 事件中，我将外部状态设置为 false。 在onDrag事件中，代码为：

    onDrag={(event) => {
      if (outOfBounds(event) === true) {
        event.stopPropagation();
        setOutside(true);                
      }
      else {
        setOutside(false);
      }
    }}

这可以防止将标记拖动到边界外时坐标发生变化，但不会隐藏标记。要隐藏标记，视图上有一个定义标记的条件样式。它是：

    <View style={[styles.outerMarker, {opacity: outside ? 0 : 1}]}>

因此，当外部状态为 true 时，不透明度为 0，隐藏标记。