有没有一种方法可以将标题添加到滚动视图,该视图在垂直滚动时是粘滞的,但是在水平滚动时是规则滚动的。
<ScrollView
directionalLockEnabled = {false} horizontal = {true} maximumZoomScale = {1} scrollEnabled = {true} minimumZoomScale = {.45} zoomScale = {1}
onScroll = {this.handleScroll}
scrollEventThrottle = {100}
stickyHeaderIndicies = {[0]}
>
<FlatList
contentContainerStyle = {{flexGrow: 1}}
style = {{height: 2000}}
data = {this.state.data}
ItemSpeparatorComponent = {this.renderSeparator}
keyExtractor = {(x, i) => i.toString()}
onEndReached = {this.loadMoreData}
onEndReachedThreshold = {0.1}
renderItem ={({item}) =>
<View style = {{flex: 1, flexDirection: 'row'}}>
<View style = {{width:100, height: 100}}>
<Text style= {styles.itemText}>
{item.inletThread}
</Text>
</View>
<View style = {{width:115, height: 100}}>
<Text style= {styles.itemText}>
{item.manufacturer}
</Text>
</View>
<View style = {{width:165, height:100}}>
<Text style= {styles.itemText}>
{item.testPressure}
</Text>
</View>
<View style = {{width:182, height: 100}}>
<Text style= {styles.itemText}>
{item.workingPressure}
</Text>
</View>
<View style = {{width:80, height: 100}}>
<TouchableOpacity onPress={ this.SampleFunction.bind(this, item)}>
<Text style = {{textAlign: 'center', paddingTop: 25, fontWeight: 'bold', fontSize: 25}}>Click here</Text>
</TouchableOpacity>
</View>
</View>
}
ItemSeparatorComponent = {this.renderSeparator}
ListHeaderComponent = {this.renderHeader}
stickyHeaderIndicies = {[0]}
/>
</ScrollView>
这可以使页眉很好,但在任一方向滚动时都不会粘在屏幕顶部。我已经通过将标题放在滚动视图中并同步两个滚动视图x组件来使其工作,但是由于状态调用,此方法非常慢。
如果有人有其他方法,我可以尝试一下。