react-native - 反应原生快照轮播，下一张卡片预览相同高度

Question

我正在使用 react native snap carousel，我试图让下一张卡片的预览看起来与当前卡片的高度相同。最初预览设置为居中但更小。我希望预览看起来完全一样。

我尝试将 containerCustomStyle 设置为 alignItems center，这使它看起来更接近我想要的结果，但大小不一样。如果您删除 contrainerCustomStyle，您会看到我不想要的夸张版本。

我有一个小吃博览会 在这里重现我的问题以及下面的一些代码。如果我需要添加图片来阐明我想要的结果，请告诉我！

我比你知道的更欣赏任何洞察力。

renderCarouselItem = ({ item }) => {
    return <View style={styles.cardContainer}>
      <Text style={styles.name}>{item.name}</Text>
    </View>;
  };
  render() {
    return (
        <Carousel
          ref={(c) => {
            this._carousel = c;
          }}
          data={this.state.coordinates}
          renderItem={this.renderCarouselItem}
          containerCustomStyle={styles.carousel}
          sliderWidth={Dimensions.get('window').width}
          itemWidth={300}
          removeClippedSubviews={false}
        />

    );
  }
}

const styles = StyleSheet.create({
  cardContainer: {
    backgroundColor: 'red',
    height: 100,
    width: 300,
    borderRadius: 10,
  },

  name: {
    color: 'black',
    fontSize: 22,
  },
  carousel: {
    alignItems: 'center',

  }
  
});