缩放ScrollView中的PanResponder

Question

我试图在可缩放ScrollView中包含可拖动组件。这在没有缩放的情况下效果很好，但是如果在尝试拖动相同的组件时放大（捏放大），则移动行为不会跟随触摸，就像可拖动元素不知道ScrollView是缩放的一样。有没有什么办法解决这一问题？这是我的代码：

export default class App extends React.Component {
  state = {
    scroll: true,
    pan: new Animated.ValueXY()
  }
  componentWillMount() {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: (evt, gestureState) => true,
      onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
      onMoveShouldSetPanResponder: (evt, gestureState) => true,
      onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,
      onPanResponderGrant: () => this.setState({scroll: false}),
      onPanResponderMove: Animated.event([null, {dx: this.state.pan.x, dy: this.state.pan.y}]),
        onPanResponderRelease: () => this.setState({scroll: true})
    })
  }
  render() {
    return (
        <ScrollView 
        contentContainerStyle={{ alignItems: "enter", justifyContent: 'center', flex: 1 }} 
        scrollEnabled={false}                      
        >
        <ImageBackground 
            source={require('./assets/icon.1.png')} 
            style={{width: '100%', height: '100%'}}
            resizeMode='center'>
              <Animated.View 
                style={{transform: this.state.pan.getTranslateTransform(), position: 'absolute', left: 150, top: 150, width: 60, height: 60, borderRadius: 30, backgroundColor: '#1abc9c50'}}
                {...this._panResponder.panHandlers}
            >
                <Text>Drag Me</Text>
            </Animated.View>
          </ImageBackground>
        </ScrollView>
    );
  }
}