leecade / leecade/react-native-swiper

RN 0.47.1 cases Swiper to have issues

Open
#511 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Need answer from author
Dominant language
JavaScript
Stars
10.5k
Forks
2.3k
PR merge metrics
No merged PRs in 30d

Description

All was working perfectly until I upgraded to RN 0.47.1 from 0.44.

Version

Which versions are you using:

  • react-native-swiper v? 1.5.8
  • react-native v0.?.? 0.47.1
Expected behaviour
  • First slide should be the first child.
  • Pagination dots should move along as you swipe.
  • Dot lit up should match the slide its on
  • adding prop index={3} should start the slide on slide 4
Actual behaviour
  • Starts on last slide
  • Pagination dots don't move on swipe
  • adding prop index={3} only affects the lit up pagination dot and not the starting slide

My code:

<Swiper
                dotColor="#FFFFFF"
                activeDotColor="#FFFFFF"
                dotStyle={dotStyle} activeDotStyle={activeDotStyle}
                paginationStyle={paginationStyle}
            >
                <View style={styles.welcome}>
                    <View style={styles.logoBox}>
                        <Image style={{ resizeMode: 'center' }} source={images.logoPurple} />
                    </View>
                    <View style={styles.welcomeTop}>
                        <H1 style={styles.welcomeTitle}>Slide 1.</H1>
                    </View>
                    <Image source={images.purpleCurve} />

                </View>
                <View style={styles.rx}>
                    <Image style={{ resizeMode: 'center' }} source={images.welcomeRx} />
                    <H1 style={styles.title}>Slide 2</H1>
                    <Text style={styles.text}>This is a short blurb that should not be more than 3 lines</Text>
                </View>
                <View style={styles.family}>
                    <Image style={{ resizeMode: 'center' }} source={images.welcomeFamily} />
                    <H1 style={styles.title}>Slide 3</H1>
                    <Text style={styles.text}>This is a short blurb that should not be more than 3 lines</Text>
                </View>
                <View style={styles.records}>
                    <Image style={{ resizeMode: 'center' }} source={images.welcomeRecords} />
                    <H1 style={styles.title}>Slide 4</H1>
                    <Text style={styles.text}>This is a short blurb that should not be more than 3 lines</Text>
                </View>
            </Swiper>

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the supplied Swiper example with react-native-swiper 1.5.8 on React Native 0.47.1, using the Swiper entry point and its index and pagination behavior. Done means the first child opens initially, swiping updates the pagination dots, and index={3} opens the fourth slide with the matching dot active.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
mobile-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.