将ScrollView设置为水平时,尽管滚动条之外还有更多项目,但SnapView仍会回弹

时间:2019-01-02 17:15:29

标签: react-native scrollview

当将滚动方向设置为水平时,我的ScrollView的行为不符合预期。只要我没有将其设置为true,一切都是正确的,但是如果我未将其设置为水平,则不会得到预期的布局(我也希望它水平滚动) Scroll Image

这是一个代码:

const AddCustomCategoryView = ({ phrases, categoryItems, onPress }) => {
const chunkedPhrases = chunkArray(phrases || [], 4);
const length = chunkedPhrases.length;           
const dl = (length % 2 === 0 || portrait) ? length : (length + 1);
const scrollWidth = calculateScrollWidth(length); 
const sectionWidth = 100 / dl;                  
return (
    <View style={{ flex: 1 }}>
            <ScrollView pagingEnabled horizontal style={{ width: scrollWidth.toString().concat('%') }} contentContainerStyle={{ height: '50%', width: '100%', flexDirection: 'row' }}>
            {chunkedPhrases.map((phraseCollection, index) => 
            <View key={`view${index}`} style={{ width: sectionWidth.toString().concat('%'), justifyContent: 'flex-start', flexWrap: 'wrap' }} >
            <TouchableHighlight style={styles.bigButtonStyle}>
            <AddIconButton text={'Add Icon'} onPress={() => AddIconOnPress()} />
            </TouchableHighlight>                   
            {categoryItems.map((item, index2) => (
                <View style={styles.bigButtonStyle}>
                <CategoryBoxView
                onPressItem={this._onPressItem}
                text={item.text}/>
                </View>
            ))}
            </View>
                )}
            </ScrollView>
            </View>
    );
};

请记住,在任何ScrollView属性上设置宽度都没有区别。

0 个答案:

没有答案