leecade / leecade/react-native-swiper
[Android] Inner swiper is not working if embedding 2 swipers
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 10.5k
- Forks
- 2.3k
- PR merge metrics
- No merged PRs in 30d
Description
Im trying to achieve a behavior that i have a photo swiper on the top of the screen, and a description below that. Photo swiper swipes e.g the particular product images, description swiper swipes the products themselves.
<View style={styles.productDetailsWrapper} >
<Swiper
ref={component => this.productSwiper = component}
style={styles.wrapper}
showsPagination={false}
onMomentumScrollEnd={this.props.productSwiperScrollEnd.bind(this.props.videoSwiper)}
>
{
this.state.products.map((product, index) => {
return <View key={`prod${index}`} style={styles.productSlide}>
<View style={styles.productImageWrapper}>
<Swiper
ref={component => this.productSwiper = component}
style={styles.wrapper}
showsPagination={false}
onMomentumScrollEnd={this.props.productSwiperScrollEnd.bind(this.props.videoSwiper)}
>
{
product.images.map((image, index) => {
return <View key={`image${index}`} style={styles.productImageWrapper}>
<ProductImages images={product.images} />
</View>
})
}
</Swiper>
</View>
<View style={styles.productDetails}>
<Text style={styles.descriptionHeader}>Description:</Text>
<Text style={styles.descriptionText}>
{product.description}
</Text>
</View>
</View>
})
}
</Swiper>
</View >
Any ideas how to make it work on android? On iOS works like a charm.
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
Start with the nested Swiper example in the issue and reproduce it on Android, then compare the behavior with iOS. Investigate the outer product swiper and inner image swiper interaction; done means both swipers respond independently on Android as they do on iOS.
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
- 30/100