react native 手指拖拽小球添加初始值问题

Question

需求： 拖拽一个小球，在屏幕内移动

已有代码：（官网例子）

    class DraggableView extends React.Component {
      constructor(props) {
        super(props);
        this.state = {
          pan: new Animated.ValueXY(), // inits to zero
        };
        this.state.panResponder = PanResponder.create({
          onStartShouldSetPanResponder: () => true,
          onPanResponderMove: Animated.event([
            null,
            {
              dx: this.state.pan.x, // x,y are Animated.Value
              dy: this.state.pan.y,
            },
          ]),
          onPanResponderRelease: () => {
            Animated.spring(
              this.state.pan, // Auto-multiplexed
              {toValue: {x: 0, y: 0}}, // Back to zero
            ).start();
          },
        });
      }
      render() {
        return (
          <Animated.View
            {...this.state.panResponder.panHandlers}
            style={this.state.pan.getLayout()}>
            // 此处假设是一个带颜色的小球...
          </Animated.View>
        );
      }
    }

上例代码最终实现的效果是

出现的问题： 1、小球跟随手指移动，释放手指时 小球回弹 2、下一次手指动作时，小球位置跳到 最初的 默认位置

修改上例代码，注释掉

        onPanResponderRelease: () => {
            // Animated.spring(
            //  this.state.pan, // Auto-multiplexed
            //  {toValue: {x: 0, y: 0}}, // Back to zero
            // ).start();
          },
          

问题1 得到解决，但问题2经过一个下午的调试都没有得到解决，希望等达到Rn开发者的 实现思路

上例中 主要用到的还是 手指动作onPanResponderMove 和 Animated.ValueXY 的关联，
在下午的实现中，在 Animated.event 中 dx: this.state.pan.x, 如何添加上一次最终的值，让下一次的小球起始时，不跳回初始位置；

其实在另外一个demo 中 通过 Animated.Value 和 Animated.add 合并两个一围坐标实现拖拽效果，但本人还是期望能够通过 Animated.ValueXY 二维坐标直接快速实现，求思路、解决方案... 多谢！！！

Answer 1

请问大佬 这个问题有解决吗