react-native scrollview觸摸滾動事件

目錄

• 1、幾個已知的滑動或者滑動開始結束的方法：
• 2、還有其他的一些事件如下
• 3、下面就這些方法的順序做個簡單的介紹：
• 4、android上的時間分為兩種，一個是滑動一次，一個是連續滑動兩次甚至多次，詳見下圖：
  • 4.1、滑動一次
  • 4.2、滑動兩次或者多次：

1、幾個已知的滑動或者滑動開始結束的方法：

1. onScroll：在滾動過程中, 每幀最多調用一次此函數, 調用的頻率可以用scrollEventThrottle屬性來控制.
2. onMomentumScrollEnd：當一幀滾動完畢時調用.
3. onScrollAnimationEnd ：ios上的當滾動動畫結束時調用.

2、還有其他的一些事件如下

觸摸事件里面有攜帶event，大家可以再下面的方法里面更改一些view操作就可以打印出來這些event攜帶的信息了

1. onScrollBeginDrag：一個子view滑動開始 拖動時觸發，注意和onMomentumScrollBegin的區別
2. onScrollEndDrag：一個子view滾動結束 拖拽時觸發，注意和onMomentumScrollEnd的區別
3. onTouchStart：按下屏幕時觸發
4. onTouchMove：移動手指時觸發
5. onTouchEnd：手指離開屏幕觸摸結束時觸發
6. onMomentumScrollBegin：當一幀滾動開始時調用.
7. onMomentumScrollEnd：當一幀滾動完畢時調用.
8. onStartShouldSetResponder：觸摸開始時是否成為響應者
9. onStartShouldSetResponderCapture：防止子視圖在觸摸開始時成為應答器
10. onScrollShouldSetResponder：滾動時是否成為響應者
11. onResponderGrant：開始響應時觸發
12. onResponderRelease：手指釋放后，視圖成為響應者
13. onResponderReject：響應拒絕
14. onScroll：滾動時觸發，會觸發多次

3、下面就這些方法的順序做個簡單的介紹：

首先在ios上進行測試，測試的結果如下：

由上圖可以看出執行的順序，

1. 首先是按下屏幕時觸發onTouchStart，
2. 然后手指移動觸發onTouchMove，會調用一次或者多次，
3. 如果左右滑動，滑動開始拖動觸發onScrollBeginDrag，View開始變化，View成為響應者，
4. 然后onScroll … onTouchMove這兩個會觸摸多次，
5. 然后手指離開屏幕觸發onResponderRelease，
6. 接着觸摸結束onTouchEnd
7. 然后是滑動結束拖拽時觸發onScrollEndDrag，接着就是一幀滾動的開始onMomentumScrollBegin，它的起始位置和onScrollEndDrag的結束位置重合；
8. 然后是滾動滾動onScroll，
9. 然后是一幀滾動的結束onMomentumScrollEnd，
10. 最后偶爾還會滾動下onScroll，這個有時間不出來，我覺得跟有抖動一樣

4、android上的時間分為兩種，一個是滑動一次，一個是連續滑動兩次甚至多次，詳見下圖：

4.1、滑動一次

大家可以看出和ios的區別

1. 少了個觸摸結束onTouchEnd，onResponderGrant、onResponderRelease，這三個.
   直接就是觸摸開始-->移動-->開始拖拽-->滾動-->拖拽結束（手指離開了）-->一幀滾動開始-->滾動-->一幀滾動結束-->滾動

2. 如果不滑動，只是點擊離開，只會觸發onTouchStart和onTouchEnd；

4.2、滑動兩次或者多次：