react-native-reanimated-carousel

react-native-reanimated-carousel copied to clipboard

ios: 17.5.1 react-native-reanimated-carousel:3.5.1 react-native-gesture-handler: 2.16.2 react-native-reanimated: 3.12.0

import * as React from 'react';
import { Dimensions, Text, View } from 'react-native';
import Carousel from 'react-native-reanimated-carousel';

function Index() {
    const width = Dimensions.get('window').width;
    return (
        <View style={{ flex: 1 }}>
            <Carousel
                loop
                width={width}
                height={width / 2}
                autoPlay={true}
                data={[...new Array(6).keys()]}
                scrollAnimationDuration={1000}
                onSnapToItem={(index) => console.log('current index:', index)}
                renderItem={({ index }) => (
                    <View
                        style={{
                            flex: 1,
                            borderWidth: 1,
                            justifyContent: 'center',
                        }}
                    >
                        <Text style={{ textAlign: 'center', fontSize: 30, color: 'white' }}>
                            {index}
                        </Text>
                    </View>
                )}
            />
        </View>
    );
}

export default Index;

Hey there, @pandaCure! I'm here to help you with any bugs, questions, or contributions you have regarding the repository. Feel free to ask me anything while waiting for a human maintainer.

The issue with the autoPlay animation not working might be due to the autoPlayInterval property not being set. You can resolve this by adding the autoPlayInterval property to your Carousel component. Here is the updated code snippet:

import * as React from 'react';
import { Dimensions, Text, View } from 'react-native';
import Carousel from 'react-native-reanimated-carousel';

function Index() {
    const width = Dimensions.get('window').width;
    return (
        <View style={{ flex: 1 }}>
            <Carousel
                loop
                width={width}
                height={width / 2}
                autoPlay={true}
                autoPlayInterval={2000} // Set the autoPlayInterval to 2000ms (2 seconds)
                data={[...new Array(6).keys()]}
                scrollAnimationDuration={1000}
                onSnapToItem={(index) => console.log('current index:', index)}
                renderItem={({ index }) => (
                    <View
                        style={{
                            flex: 1,
                            borderWidth: 1,
                            justifyContent: 'center',
                        }}
                    >
                        <Text style={{ textAlign: 'center', fontSize: 30, color: 'white' }}>
                            {index}
                        </Text>
                    </View>
                )}
            />
        </View>
    );
}

export default Index;

By adding the autoPlayInterval property, the carousel should now automatically play as expected ^[1].

To continue talking to Dosu, mention @dosu.

@dohooo @dosu

@ghost, this seems to be a bit tricky, could you step in and provide your expertise?

To continue talking to Dosu, mention @dosu.

@dohooo Same thing happening for us. Although we are at v4.0.0-alpha.12. It stopped working without any code changes

@dohooo we are using below lib versions "react-native-reanimated": "^3.6.1", "react-native-reanimated-carousel": "4.0.0-alpha.0", "react-native-gesture-handler": "^2.12.0", It also stopped working for us

Hi, @pandaCure. I'm Dosu, and I'm helping the react-native-reanimated-carousel team manage their backlog. I'm marking this issue as stale.

Issue Summary:

• The autoPlay feature is not functioning on iOS 17.5.1.
• A suggestion to add an autoPlayInterval was made but not accepted by you.
• Other users, @itsashis4u and @pantomath91, have reported similar issues, suggesting a broader problem.
• The issue remains unresolved and requires further investigation.

Next Steps:

• Please confirm if this issue is still relevant with the latest version of the library by commenting here.
• If there is no further activity, the issue will be automatically closed in 7 days.

Thank you for your understanding and contribution!