Làm cách nào để xử lý sự kiện báo chí dài của PanResponder?

Question

Tôi đang cố gắng xử lý một báo chí dài trong React Native thông qua PanResponder. Sau một tìm kiếm phong nha, tôi không thể tìm ra cách để làm điều đó "đúng cách", vì vậy tôi hỏi ở đây. Ý tưởng là để thực hiện mã khi một báo chí dài (click) trên màn hình được phát hiện. tôi đã đưa ra một cái gì đó như thế này:

handlePanResponderGrant(e, gestureState){ 
    // On the press of the button set a timeout 
    myVar = setTimeout(this.MyExecutableFunction(), LONG_PRESS_MIN_DURATION); 
} 

handlePanResponderRelease(e, gestureState) { 
    // Clear the timeout if the press is released earlier than the set duration 
    clearTimeout(myVar); 
} 

Đây có phải là cách đúng đắn để xử lý một nhấn và giữ hoặc là có một cách tốt hơn?

Answer 1

Tôi đã kết thúc thực hiện chức năng này với setTimeout. Đây là mã có chức năng để phát hiện phần nào của màn hình đã được dài ép (trái hoặc phải):

handlePanResponderGrant(e, gestureState) { 
    console.log('Start of touch'); 

    this.long_press_timeout = setTimeout(function(){ 
      if (gestureState.x0 <= width/2) 
      { 
       AlertIOS.alert(
        'Left', 
        'Long click on the left side detected', 
        [ 
        {text: 'Tru dat'} 
        ] 
       ); 
      } 
      else { 
       AlertIOS.alert(
        'Right', 
        'So you clicked on the right side?', 
        [ 
        {text: 'Indeed'} 
        ] 
       ); 
      } 
     }, 
     LONG_PRESS_MIN_DURATION); 
} 
handlePanResponderMove(e, gestureState) { 
    clearTimeout(this.long_press_timeout); 
} 
handlePanResponderRelease(e, gestureState){ 
    clearTimeout(this.long_press_timeout); 
    console.log('Touch released'); 
} 
handlePanResponderEnd(e, gestureState) { 
    clearTimeout(this.long_press_timeout); 
    console.log('Finger pulled up from the image'); 
} 

Answer 2

Tôi có Carousel bên scrollview, và tôi muốn biết nơi người dùng nhấn vào mục của Carousel . Tôi đã làm điều này nhờ vào @Alexander Netsov.

this._panResponder = PanResponder.create({ 
    onStartShouldSetPanResponder:() => true, 
    onMoveShouldSetPanResponder:() => false, 
    onPanResponderGrant: (e, gestureState) => { 
    this.onLongPressTimeout = setTimeout(() => { 
     console.log("ON LONG PRESS", gestureState); 
    }, LONG_PRESS_DELAY); 
    }, 
    onPanResponderRelease:() => { 
    clearTimeout(this.onLongPressTimeout); 
    }, 
    onPanResponderTerminate:() => { 
    clearTimeout(this.onLongPressTimeout); 
    }, 
    onShouldBlockNativeResponder:() => false, 
    onPanResponderTerminationRequest:() => true 
}); 

Dọc ScrollView, ngang Carousel và PanResponder, tất cả đang làm việc hoàn toàn tốt đẹp trên Android.

Lưu ý: nó chưa được thử nghiệm trên iOS