Carousel child content not visible in screen

[Anandks1993]

I used the example on the page and the children is not in visible mode. Only the indicators are visible. I don't know why. Please suggest any idea if you guys have any.

The following is the code I used.

<View style={{
                flex: 1,
                justifyContent: 'center',
                alignItems: 'center',
 }}>
            <View style={styles.container}>
                <Carousel
                    width={375}
                    height={300}
                    animate={false}
                    >
                        <View style={styles.contentContainer}>
                            <Text>Page 1</Text>
                        </View>
                        <View style={styles.contentContainer}>
                            <Text>Page 2</Text>
                        </View>
                        <View style={styles.contentContainer}>
                            <Text>Page 3</Text>
                        </View>
                </Carousel>
            </View>
    </View>

And the following is the snapshot for the screen.

[deniss-y]

Hi, @Anandks1993 Have same issue. Did you find a workaround?

[Anandks1993]

@th0rv I tried the above with react-native-material-bottom-navigation, I couldn't able to find a workaround with that. So I moved to nativebase(https://docs.nativebase.io/Components.html#footer-tabs-def-headref) which has footer tab in it, I could able to use this package with that.

[fengxiongjiang]

i encountered similar problem, but im using react-navigation tab-navigator. When the app loaded, the carousel is empty, after navigate to another screen and back to the initial page the carousel then able to render its children. I manage to solve it by adding a timer, after 1 second i set a boolean state to true in order to render the carousel.

[aracchi]

@fengxiongjiang hi do you have an example of your workaround? im stuck at the same thing