将水平ScrollView的高度设置为索引内容的高度

时间:2018-08-19 13:04:58

标签: javascript react-native

我在另一个垂直 ScrollView中有一个水平 Animated.ScrollView

我将水平视图用作选项卡视图(更改快照项目),并且它可以正常工作,但是现在出现了问题。...我在具有指定高度{{1 }}高度将获得最长的高度,并且所有选项卡视图都将具有相同的高度,尽管它们不需要那么长的高度:

ScrollView

如上所示,我在第二个标签中使用的项目的高度很高,并且可以拉伸 <Animated.ScrollView> <ScrollView //<<<<<<I'm talk about this one ref={(scr) => this._scrollView = scr} decelerationRate={0} snapToInterval={Dimensions.get('window').width} snapToAlignment={"center"} pagingEnabled horizontal <<<<<<<<<< onContentSizeChange={() => this._scrollView.scrollTo({ x: this.state.index * Dimensions.get('window').width, y: 0, animated: true })} onMomentumScrollEnd={(event) => this.focuser(event.nativeEvent.contentOffset.x)} > <View>...some thing short<View> <View>..some thing Long<View> //<<<<this one is long <View>...Some thing short<View> </ScrollView> 的整个高度!现在没有问题了...我需要为此项目(此视图)进行适当的拉伸,但是我不需要其他选项卡的高度。但是他们达到了这个高度,并且可以使用户向下滚动。它是如此丑陋。 我想将ScrollView的{​​{1}}设置为Current选项卡内容(Current index content)的高度。您对此有何解决方案?

1 个答案:

答案 0 :(得分:1)

据我所知,这是ScrollView的局限性。解决方法是,您可能要尝试用页面上固定大小的垂直ScrollView替换View。这样,它们都将具有各自的可滚动高度。但是,由于您已经在垂直ScrollView中,因此响应滚动事件可能会有些棘手。

更新:

另一种方法是根据单个项目的数量调整其高度,以使每个页面的长度相同。您可以在this example中看到它。