2

当用户拖动具有特定滑动长度的容器时,我正在尝试执行触觉反馈。因此,使用以下代码,我试图在用户使用事件侦听器拖动容器时获取 translateY 的值:

constructor(props: TweetsProps) {
    super(props);
    const { tweets } = props;
    this.state = {
        ...
    };

    ...

    this.onPanGestureEvent = Animated.event(
        [{ nativeEvent: { translationX: this.translationX, translationY: this.translationY } }],
        {
            useNativeDriver: true,
            listener: this.onPan.bind(this),
        },
    );

    this.onGestureEvent = event(
        [
            {
                nativeEvent: {
                    translationX: this.translationX,
                    translationY: this.translationY,
                    velocityX: this.velocityX,
                    state: this.gestureState,
                },
            },
        ],
        { useNativeDriver: true },
    );
}

  ...

onPan({ nativeEvent: { translationY } }) {
    console.log("fired")
    if (translationY > 130 || translationY < -130) {
        Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Heavy);
    }
}

render() {
    const { onGestureEvent, translateY, onPanGestureEvent, onResponse } = this;
    ...

    return (
        <SafeAreaView style={styles.container}>
            <View style={styles.cards}>
                <PanGestureHandler
                    onHandlerStateChange={onGestureEvent}
                    onGestureEvent={onPanGestureEvent}
                    {...{ onGestureEvent }}

                >
                    <Animated.View {...{ style }} onResponderMove={onResponse}>
                        <Card tweet={lastTweet} swipeDown={this.state.swipeDown} {...{
                            likeOpacity,
                            nopeOpacity
                        }} />
                    </Animated.View>
                </PanGestureHandler>
            </View>
     ...
    );
  }

我的代码没有触发onPan函数,我在这里做错了什么?如何正确获取此侦听器值?

4

0 回答 0