github地址：
https://github.com/leecade/react-native-swiper
npm i react-native-swiper --save
使用：
<Swiper
showsButtons={true} //为false时不显示控制按钮
height={220}
autoplay={true} //自动轮播
autoplayTimeout={5} //每隔5秒切换
dot={<View style={styles.swiper_dot}/>} //未选中的圆点样式
activeDot={<View style={styles.swiper_activeDot}/>} //选中的圆点样式
paginationStyle={styles.swiper_pagination}> //小圆点的位置
{this.swiperChildrenView()}
</Swiper>
样式：
swiper_dot: {
backgroundColor: 'rgba(0,0,0,.5)',
width: 8,
height: 8,
borderRadius: 4,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
marginBottom: 3,
},
swiper_activeDot: {
backgroundColor: WhiteTextColor,
width: 16,
height: 2,
borderRadius: 1,
marginLeft: 2,
marginRight: 2,
},
注意 ：
运行的时候会报错 Cannot read property 'x' of undefined
33.png
解决方案：
修改react-native-swiper下src/index.js
static defaultProps = {
horizontal: true,
pagingEnabled: true,
showsHorizontalScrollIndicator: false,
showsVerticalScrollIndicator: false,
bounces: false,
scrollsToTop: false,
removeClippedSubviews: true,
automaticallyAdjustContentInsets: false,
showsPagination: true,
showsButtons: false,
disableNextButton: false,
loop: true,
loadMinimal: false,
loadMinimalSize: 1,
autoplay: false,
autoplayTimeout: 60, //默认2.5,改大一些
autoplayDirection: true,
index: 0,
onIndexChanged: () => null
}
44.png
效果：
22.png
