mobile-darmasaba/components/home/carouselHome.tsx

import Styles from "@/constants/Styles";
import React from "react";
import { Dimensions, Text, View } from "react-native";
import { useSharedValue } from "react-native-reanimated";
import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel";

export default function CaraouselHome() {
   const ref = React.useRef<ICarouselInstance>(null);
   const width = Dimensions.get("window").width;
   const data = [...new Array(6).keys()];
   const progress = useSharedValue<number>(0);

   return (
      <View style={[Styles.mv15]}>
         <Carousel
            ref={ref}
            width={width}
            height={width / 2.5}
            data={data}
            loop={true}
            autoPlay={true}
            autoPlayInterval={5000}
            onProgressChange={progress}
            renderItem={({ index }) => (
               <View style={Styles.caraoselContent} >
                  <Text style={{ textAlign: "center", color: "white", fontWeight: 'bold' }}>BANNER DARMASABA</Text>
               </View>
            )}
         />
      </View>
   )
}