leecade / leecade/react-native-swiper
onIndexChanged setState change shifts Swiper component until tapping resets to correct style
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 10.5k
- Forks
- 2.3k
- PR merge metrics
- No merged PRs in 30d
Description
OS 14.4
Version
Which versions are you using:
- react-native-swiper v1.6.0
- react-native v0.62.13
Expected behaviour
When user swipes on component, it should move to next page. Currently I have onIndexChange triggering a change in state (for a variable that isn't the index -- it is something to change a tab header). setState should execute properly and the page change should animate properly with the left hand side of the page stopping at the beginning of the parent view
Actual behaviour
The setState changes properly, and the swipe to the next page animates properly; however, the page swiped to goes past the parent view's margins (about 40 pixels or so). It remains off the end until I click anywhere within the Swiper view and then it immediately goes back to how it should be (not shifted off the edge). I have tried specifying height, width, container style, and index value, but nothing has worked except simply not calling setState. I have also tried onMomentumScrollEnd or using a setTimeout with both trigger functions with the same results. Interesting to note that it does not happen to the first page, but all after the first one (going in either direction) even when the initial index specified isn't the first page.
How to reproduce it>
- loop is false, showPagination is false, onIndexChanged triggers a setState for a toggle value not used anywhere within the Swiper children.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue with react-native-swiper v1.6.0 and React Native 0.62.13 using loop false, showPagination false, and an onIndexChanged setState update. Inspect the Swiper component's index-change and layout or scroll handling; done when subsequent pages stop at the parent view boundary without requiring a tap.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100