以项目（业务GO）为例：
react-native-swiper 轮播（用在首页的图集轮播）
https://github.com/leecade/react-native-swiper
react-native-image-zoom-viewer 图集查看（组件功能多，适合用于图集文章和大图查看）
均是第三方组件，安装方法一样，都需要在文件顶部引入，如：
import Swiper from 'react-native-swiper';
关于'react-native-swiper'的基本用法：
基础属性：
属性 |
默认 |
类型 |
描述 |
horizontal |
true |
bool |
如果true，滚动视图在一行中水平排列， 而不是垂直排列。 |
loop |
true |
bool |
设置为false禁用连续循环模式。 |
index |
0 |
number |
初始幻灯片索引(下标)。 |
showsButtons |
false |
bool |
设置为true使控制按钮可见。 |
autoplay |
false |
bool |
设置为true启用自动播放模式。 |
onIndexChanged |
（index）=> null |
func |
当用户刷新时用新的索引(下标)调用 |
自定义基本样式和内容
属性 |
默认 |
类型 |
描述 |
width |
- |
number |
如果没有指定默认 启用全屏模式flex: 1。 |
height |
- |
number |
如果没有指定默认 全屏模式flex: 1。 |
style |
{...} |
style |
请参阅源中的默认样式。 |
loadMinimal |
false |
bool |
只载入当前索引幻灯片， loadMinimalSize幻灯片前后。 |
loadMinimalSize |
1 |
number |
看到 loadMinimal |
loadMinimalLoader |
<ActivityIndicator /> |
element |
幻灯片未加载时 显示的自定义加载器 |
分页
属性 |
默认 |
类型 |
描述 |
showsPagination |
true |
bool |
设置为true 使分页可见。 |
paginationStyle |
{...} |
style |
自定义样式 将与默认样式合并。 |
renderPagination |
- |
function |
三个参数， 可以显示索引。 |
dot |
<View style={{backgroundColor:'rgba(0,0,0,.2)', width: 8, height: 8,borderRadius: 4, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,}} /> |
element |
允许自定义点元素。 |
activeDot |
<View style={{backgroundColor: '#007aff', width: 8, height: 8, borderRadius: 4, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,}} /> |
element |
允许自定义活动点元素。 |
dotStyle |
- |
object |
允许自定义活动点元素。 |
dotColor |
- |
string |
允许自定义活动点元素。 |
activeDotColor |
- |
string |
允许自定义活动点元素。 |
activeDotStyle |
- |
object |
允许自定义活动点元素。 |
自动播放
属性 |
默认 |
类型 |
描述 |
autoplay |
true |
bool |
设置为true启用自动播放模式。 |
autoplayTimeout |
2.5 |
number |
自动播放转换之间的延迟（秒）。 |
autoplayDirection |
true |
bool |
循环方向控制。 |
控制按钮
属性 |
默认 |
Type |
Description |
showsButtons |
true |
bool |
是否显示控制箭头按钮 |
buttonWrapperStyle |
{position: 'absolute', paddingHorizontal: 15, paddingVertical: 30, top: 70, left: 0, alignItems:'flex-start'} |
style |
定义默认箭头按钮的样式 |
nextButton |
<Text style={{fontSize:60, color:'#00a7ec', paddingTop:30, paddingBottom:30}}>‹</Text> |
element |
自定义右箭头按钮样式 |
prevButton |
<Text style={{fontSize:60, color:'#00a7ec', paddingTop:30, paddingBottom:30}}>›</Text> |
element |
自定义左箭头按钮样式 |
以上基本就可以满足对轮播组件的使用了，或许还有其他需求，那就只能再看看文档介绍。
关于'react-native-image-zoom-viewer '基本用法：
而关于图集组件的，还是没有找到相关文档，只能借助别人的咯：https://github.com/ascoders/react-native-image-viewer/blob/master/src/image-viewer.type.ts
不过还好，足够我们简单使用。唯一值得提出的便是，图集中的图片与下部的简介应该怎样连接起来，于是……
import ImageViewer from 'react-native-image-zoom-viewer';//引入图集组件
可以移步这里：http://www.cnblogs.com/vipstone/p/7611676.html
