如何正确使用viewpagerandroid上的“peekenabled”属性?

<ViewPagerAndroid peekEnabled={true} >{this.props.children}</ViewPagerAndroid>

我想要这样的东西
android - react-native ViewPagerAndroid peek属性-LMLPHP

最佳答案

似乎peekEnabled要按预期工作需要ViewPagerAndroid拥有padding
查看RN source code,子视图样式设置为position: absoluteright,left,top,bottom: 0,因此父视图的容器填充不起作用。
作为解决方法,您可以将pageMargin设置为负值,并在子视图中使用paddingLeft,paddindRight来实现相同的效果。
例如:

<ViewPagerAndroid pageMargin={-70} style={{ flex: 1 }}>
  <View style={{ padding: 35 }}>
    <View style={{ backgroundColor: 'pink', flex: 1 }} />
  </View>
  <View style={{ padding: 35 }}>
    <View style={{ backgroundColor: 'cyan', flex: 1 }} />
  </View>
  <View style={{ padding: 35 }}>
    <View style={{ backgroundColor: 'magenta', flex: 1 }} />
  </View>
</ViewPagerAndroid>

demo

10-08 18:45