عندى ScrollView أفقى .. أنا اريد ان اجعل عن التمرير فانها يكون العنصر فى منتصف الشاشة .. هده هى الصورة

أنا اريد ان اقوم بعمل pagination و يكون الكارد المختار فى منتصف السكرين وليست هكدا كما فى الصورة 

هدا هو الكود 

 <View style={styles.cardsContainer}>
         <View style={styles.cardsContainer}>
          <Animated.ScrollView horizontal
          scrollEventThrottle={1}
          showsHorizontalScrollIndicator={false}
          pagingEnabled
          snapToInterval={CARD_WIDTH + 20}
          snapToAlignment="center"
          
          >
            {ads.map((item, index) => {
              return (
                <MapCard
                  onPress={() => goToSelectedLocation(index)}
                  style={{margin: 4}}
                  title={item.title}
                  image={item.image}
                  price={item.price}
                />
              );
            })}
          </Animated.ScrollView>
        </View>


// Styles
cardsContainer: {
    height: phoneHeight * 0.22,
    bottom: 50,
    position: 'absolute',
  },