[Fixed] React Native Android — PanResponder — жесты не работают

В моем случае я следовал официальным документам RN для панответчика. Он ответил на iOS, но не на любом телефоне Android, на котором я тестировал.

RN docs предлагает вам использовать следующее:

componentWillMount: function() {
    this._panResponder = PanResponder.create({
        // Ask to be the responder:
        onStartShouldSetPanResponder: (evt, gestureState) => true,
        onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
        onMoveShouldSetPanResponder: (evt, gestureState) => true,
        onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,

        onPanResponderGrant: (evt, gestureState) => {
            // The gesture has started. Show visual feedback so the user knows
            // what is happening!

            // gestureState.d{x,y} will be set to zero now
        },
        onPanResponderMove: (evt, gestureState) => {
            // The most recent move distance is gestureState.move{X,Y}

            // The accumulated gesture distance since becoming responder is
            // gestureState.d{x,y}
        },
        onPanResponderTerminationRequest: (evt, gestureState) => true,
        onPanResponderRelease: (evt, gestureState) => {
            // The user has released all touches while this view is the
            // responder. This typically means a gesture has succeeded
        },
        onPanResponderTerminate: (evt, gestureState) => {
            // Another component has become the responder, so this gesture
            // should be cancelled
        },
        onShouldBlockNativeResponder: (evt, gestureState) => {
            // Returns whether this component should block native components from becoming the JS
            // responder. Returns true by default. Is currently only supported on android.
            return true;
        },
    });
},

render: function() {
    return (
        <View {...this._panResponder.panHandlers} />
    );
},

Поиграв с ним, он работает на Android, изменяя тот же блок на

// Ask to be the responder:
onStartShouldSetPanResponder: (evt, gestureState) => {
    return false;
},
onStartShouldSetPanResponderCapture: (evt, gestureState) => {
    return false;
},

onMoveShouldSetPanResponder: (evt, gestureState) => {
    // Listen for your events and show UI feedback here
    return false;
},
onMoveShouldSetPanResponderCapture: (evt, gestureState) => {
    return false;
},
onPanResponderGrant: (evt, gestureState) => {
   return false;
},
onPanResponderMove: (evt, gestureState) => {
    return false;
},
onPanResponderTerminationRequest: (evt, gestureState) => {
    return false
},
onPanResponderRelease: (evt, gestureState) => {
    // This wont get called
    return true;
},
onPanResponderTerminate: (evt, gestureState) => {
    return false;
},
onShouldBlockNativeResponder: (evt, gestureState) => {
   return false;
},

Разница здесь в том, чтобы возвращать false для событий «onStartShouldSetPanResponder», «onStartShouldSetPanResponderCapture» и «onMoveShouldSetPanResponderCapture», а затем помещать свою логику в «onMoveShouldSetPanResponder» вместо события «onPanResponderRelease».

Надеюсь, это поможет кому-то. Ваше здоровье

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *