Quiero crear un carrusel como el que se muestra a continuación. El elemento central tendrá una elevación más alta para indicar que este es el elemento actual y cada vez que el usuario se desplace, el siguiente elemento se elevará y así sucesivamente. El elemento central se superpondrá al elemento izquierdo y derecho. Traté de usar react-native-snap-carousel con la opción de pila, pero eso solo muestra el elemento de la izquierda y, en el caso de iOS, solo el elemento de la derecha. Probé Tinder, pero eso es bastante igual también. Lo intenté por defecto, pero hay espacios entre cada elemento que no quiero. Intenté reaccionar-nativo-ancla-carrusel. Pero, esto hace que el elemento central sea transparente por alguna razón.
<Carousel style={styles.carousel} data={review} renderItem={renderitem} itemWidth={240} activeSlideAlignment="center" sliderWidth={windowWidth - 20} separatorWidth={-100} itemContainerStyle={{ alignItem: 'center', marginTop: 18, }} inActiveOpacity={0.1} ref={carouselRef} loop={true} />El elemento de procesamiento está debajo
const renderitem = ({item}) => { return ( <View style={[styles.item]} onPress={() => { this._carousel.scrollToIndex(index); }}> <View style={styles.circle}> <Image style={styles.image} source={{uri: item.serviceImage}} resizeMode="cover" /> </View> <Text style={styles.serviceNameText}>{item.serviceName}</Text> <Text style={styles.name}>{item.reviewerName}</Text> <Text style={styles.content}>{item.content}</Text> </View> ); };