CODEWITHSUNDEEP
react-nativecarousel
Raghusingh
Raghusingh

Reputation: 418

How to control swapping on click of button in carousel in react-native?

When I will click on button I want to control my swapping slides of carousel .That means if I will click on button then new slide will come in carousel.

I am using 'react-native-snap-carousel' package for achieve my functionality in react-native.so please help me how I can achieve this functionality.Thank you in advance.

     SwapSlide = (value) => {
                    this.setState({ indexvalue: value }, () => {
                        console.log("get swapindex ===>>>", this.state.indexvalue)
                    })
                }
onPressAnswer = (item) => {
        console.log("run increase method===>>>", this.increase('progress', 10));
        console.log("run swapslide method===>>>", this.SwapSlide.snapToNext());
        this.AddQuestionAnswer(item)
    }

 renderItemAnswer = ({ item, index }) => {

        return (
            <View>
                <TouchableOpacity style={styles.answerTouchable} onPress={() =>this.onPressAnswer(item)}>
                    <Text style={styles.answerText}>{item.answer}</Text>
                </TouchableOpacity>
            </View>
        )
    }

         <Carousel
                                data={questionList}
                                renderItem={this.renderItemQuestion}
                                hasParallaxImages={true}
                                itemWidth={wp('100%')}
                                sliderWidth={wp('100%')}
                                ref={(value)=>{this.SwapSlide=value}}    
                            />



        <TouchableOpacity onPress={() => { this.setState({ indexvalue: indexvalue + 1 }) }}><Text style={styles.skiptext}>Skip</Text></TouchableOpacity>

Upvotes: 3

Views: 4355

Answers (1)

Jits
Jits

Reputation: 545

Use method snapToNext() for next slide

<TouchableOpacity onPress={() => this.SwapSlide.snapToNext()}><Text style={styles.skiptext}>Skip</Text></TouchableOpacity>

For Previous slide you can use this.SwapSlide.snapToPrev()

Upvotes: 4

Related Questions