React-native-swiper: Swipe gesture is not detected on iOS when setting a fixed width for the Swiper, works fine on android.

[MariusMeiners]

Which OS ?

iOS

Version

Which versions are you using:

• react-native-swiper v1.5.13
• react-native v0.52.0

Expected behaviour

I expect the swipe gesture on the swiper to be picked up and executed correctly

Actual behaviour

Nothing happens.
I think you should be throwing some type of error if this is actually a system breaking thing to do or at least mention it in your Documentation.

Steps to reproduce

1. Create a Swiper
2. Give it a style prop
3. Give it a fixed width via StyleSheet.create()

[mysport12]

@MariusMeiners I just ran into this same issue. Change the 'style' prop to 'containerStyle' and reload.

[Theng]

Me also, IOS gesture not work, and the slide show only the first one ( Android working fine )

[MariusMeiners]

@mysport12 I've already used a different workaround, thanks tho ! :) i just wanted to make other people aware of the issue because it took me forever to figure out why it wasnt working....

[Theng]

@MariusMeiners , do you use different library?

[MariusMeiners]

@Theng no i just changed my layout to work with flex values instead of width then the swiper worked as expected

[Theng]

@MariusMeiners I also use flex, but on iOS show only first slide "Slide 1" and I can't swipe it also, do you have any suggestion to me.

<Swiper style={{ flex: 1 }} showsButtons={true}>
    <View style={styles.viewFlex}>
                    <Text>Slide 1</Text>
    </View>
    <View style={styles.viewFlex}>
                    <Text>Slide 2</Text>
    </View>
    <View style={styles.viewFlex}>
                    <Text>Slide 3</Text>
    </View>
</Swiper>

const styles = {
    viewFlex: {
        flex:1,
        justifyContent: "center",
        alignItems: "center"
    }
};

[xclidongbo]

me too .

[amcsi]

Adding containerStyle to <Swiper> worked for me as per @mysport12

Sample:

import { Dimensions } from 'react-native';
...
const deviceWidth = Dimensions.get('window').width;
<Swiper containerStyle={{ width: deviceWidth }}>

[MariusMeiners]

Im going to close this issue as the workaround from @mysport12 seems to be the only solution we will have going forward. I dont think any maintainer is interested in fixing this correctly.

[AugustusCosta]

Should be re open.
The gestures just no work in iOS.
I tried every suggestion but only works in Android.

[rezareact]

@MariusMeiners I just ran into this same issue. Change the 'style' prop to 'containerStyle' and reload.

That's worked for me.Tnx

[MariusMeiners]

@AugustusCosta if you want to reopen the issue you should show your exact problem otherwise it wont be reproducable for the maintainer...

[cereme]

In my case, removing flex: 1 from style of <Swiper> solved the issue.

[rakeshkumar2018]

I have this same issue. Change the 'style' prop to 'containerStyle' and work for me . Thanks

[chengguo0719]

I have this same issue. Change the 'style' prop to 'containerStyle' and work for me . Thanks

thanks... It is also working on my side.

[hooksoft]

Thanks - everything started working when I changed style to containerStyle - I was even blaming React Navigation.