Pagination dot is not moving on both android and ios
See original GitHub issueVersion Which versions are you using:
- react-native-swiper 1.6.0
- react-native v0.63.4
Expected behaviour pagination dot should move on swiping to next item
Actual behaviour pagination dot are not moving on swiping to next item. Some time it works some time it stays stuck at 0 position.
How to reproduce it
<Swiper
height={Metrics.heightRatio(320)}
containerStyle={styles.swiper}
style={styles.swiper}
loop={false}
dotColor={Colors.primary.white}
dotStyle={{opacity: 0.4}}
activeDotColor={Colors.primary.white}
>
{data.map((item) => (
<ImageHandler
key={fast-${item.id}
}
source={{uri: item.path}}
style={styles.profileImg}
thumb={item.thumb}
/>
))}
</Swiper>
Issue Analytics
- State:
- Created 2 years ago
- Reactions:2
- Comments:11
Top Results From Across the Web
Pagination dots are not coming up in iOS 14 - Stack Overflow
Give the leading and trailing constraint to 20,20 and try.It worked for me. Dots size is increased in iOS 14.
Read more >Pagination Dots Images are opaque in IOS and are not visible.
We are using pageSkin , pageOnDotImage , pageOffDotImage properties of Segment which is working fine in android devices but in iOS images ...
Read more >Page controls - Human Interface Guidelines - Apple Developer
Page controls appear as a series of small indicator dots by default, representing the available pages. A solid dot denotes the current page....
Read more >Building modern sliders with HTML, CSS, and Swiper
Swiper is a wonderful tool for creating sliders. Learn how to use it to build interactive, intuitive elements that work natively anywhere.
Read more >Pagination with Jetpack Compose - YouTube
The BEST android courses in the world: https://codingwithmitch.com/In this video I show you how to build a custom pagination system using ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
{ bannerList.length ? this.renderBanner(bannerList) : undefined }
if fetching online data to fill swiper elements, the render must after the got the data
so if render the Swiper, need make a judgement at first
中文翻译:
如果填充轮播图的内容,是在获取数据后。那么,渲染轮播图组件的时候,需要加个逻辑判断。不能是空数组map渲染出来,否则,指示器就不能滑动,永远激活在第一个。
updateIndex = (offset, dir, cb) => { const state = this.state // Android ScrollView will not scrollTo certain offset when props change let index = state.index if (!this.internals.offset) // Android not setting this onLayout first? https://github.com/leecade/react-native-swiper/issues/582 this.internals.offset = {} const diff = offset[dir] - this.internals.offset[dir] const step = dir === ‘x’ ? state.width : state.height let loopJump = false