如何正确使用viewpagerandroid上的“peekenabled”属性?
<ViewPagerAndroid peekEnabled={true} >{this.props.children}</ViewPagerAndroid>
我想要这样的东西
最佳答案
似乎peekEnabled
要按预期工作需要ViewPagerAndroid
拥有padding
。
查看RN source code,子视图样式设置为position: absolute
和right,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