callstack / callstack/react-native-pager-view
onPageSelected and onScroll gives wrong position when animation wasn't completed on previous page on iPhone 12
- 主要言語
- TypeScript
- スター
- 3.4k
- フォーク
- 476
- 平均マージ
- 10日 21時間
- マージ済み PR(30日)
- 2
説明
## Environment
```
"react-native": "0.63.4",
"react": "16.14.0",
"react-native-pager-view": "^5.4.9"
```
iOS 15.2
## Description
onPageSelected and onScroll handlers giving wrong index on iPhone 12 simulator (as well as on real device too), but works on iPhone 11 (and older devices) correct. See video below (demonstrates apps on iPhone 11 and iPhone 12)
## Reproducible Demo
```
{children}
```
```
const onPageSelected = useCallback(
(e) => {
const pageIdx = e.nativeEvent.position;
console.log(pageIdx, 'PAGE IDX')
setActivePage(pageIdx);
onItemActive(pageIdx);
},
[onItemActive],
);
```
Video 1 (correct behaviour, iPhone 11 iOS 15.2, after animation is not finished onPageSelected provides correct page after gesture completed)
https://user-images.githubusercontent.com/9297785/149826584-b309417c-252e-4c55-b2c5-302dc1bb90f2.mp4
Video 2 (incorrect behaviour, iPhone 12 iOS 15.2, after animation is not finished onPageSelected provides previous page number after gesture completed)
https://user-images.githubusercontent.com/9297785/149826806-cbab3e2d-93f5-4ebf-a919-8e4b8d75f471.mp4
コントリビューションガイド
調査の方向性
Issue に示されている PagerView の使用方法と onPageSelected/onScroll ハンドラーから始め、iOS 15.2 を搭載した iPhone 12 で中断された垂直スワイプを再現し、iPhone 11 と比較します。未完了のアニメーション後に、イベントが前のページではなく到達先のページを報告すれば完了です。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- ios, react, react-native
- 領域
- mobile
- issue の種類
- バグ
- 難易度
- 4/5
- 見積もり時間
- 3〜5日
- 活発さ
- 停滞
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 35/100