手册版本 V3.0
组件名称
graceSwiper : /graceUI/组件目录/graceSwiper
组件介绍
01 发布于 2020-04-22 ，新版本功能更全、兼容性更好;
02 进度点高度可定制化;
03 图片计算精度更高;
04 带有文本标题属性;
05 2020-05-20 组件添加点击事件，对应激活 taped 事件并携带被点击选项的索引；
重要说明
01 组件宽度高度算法 ( 应用的轮播图宽高比应该是一样的哦 )
组件宽度 = 外层元素宽度 如 700rpx
组件高度 = 轮播图高度 / 轮播图宽度 * 组件宽度，如 轮播图片为 500 px * 225 px, 那么 :
组件高度 = 225 / 500 * 700 = 315 rpx
02 请参考演示代码利用属性配置出各种形式的轮播组件;
组件属性
| 属性名称 | 类型 | 默认值 | 作用 |
| width | Number | 750 | 组件宽度，单位 rpx |
| height | Number | 300 | 组件高度，单位 rpx |
| swiperItems | Array | [] | 轮播项目数组，格式见演示代码 |
| borderRadius | String | 10rpx | 图片圆角尺寸 |
| indicatorBarHeight | Number | 68 | 进度圆点或标题文本高度，单位 rpx |
| indicatorBarBgColor | String | rgba(0,0,0,0) | 进度圆点或标题文本背景颜色 |
| indicatorWidth | Number | 18 | 进度圆点宽度，单位 rpx |
| indicatorActiveWidth | Number | 18 | 进度圆点激活后宽度，单位 rpx |
| indicatorHeight | Number | 18 | 进度圆点高度，单位 rpx |
| indicatorRadius | Number | 18 | 进度圆点圆角尺寸，单位 rpx |
| indicatorColor | String | rgba(255, 255, 255, 0.6) | 进度圆点默认颜色 |
| indicatorActiveColor | String | #3688FF | 进度圆点激活后颜色 |
| indicatorType | String | dot | none : 不展示圆点, dot : 可修饰的圆点, number : 数值+文本形式 |
| indicatorPosition | String | absolute | 圆点定位方式,赋值 relative 可以实现圆点在轮播图片下方 |
| indicatorDirection [ 2020.09.15 新增 ] | String | center | 圆点点横向对齐方式，默认 center 居中, flex-start 左对齐, flex-end 右对齐 |
| spacing | Number | 50 | 轮播项目间距 [ nvue 不支持 ] |
| padding | Number | 26 | 非激活项目的缩小间距 [ nvue 不支持 ] |
| interval | Number | 5000 | 自动轮播间隔时间 |
| autoplay | Boolean | true | 是否自动播放 |
| currentIndex | Number | 0 | 当前激活项目索引 |
| opacity | Number | 0.66 | 非激活项目透明度 |
| titleColor | String | #FFFFFF | 标题文本颜色 |
| titleSize | String | 28rpx | 标题文本大小 |
组件事件
01. swiperchange
轮播选项切换时触发，携带参数 : 当前轮播项目的索引值。
02 taped 2020-05-20 新增
当选项数据的 opentype 为 click 时，用户点击选项触发并携带当前点击选项的索引值;
演示代码
UNI 普通版本
NVUE 版本
微信小程序独立版本
登录并购买 GraceUI 后可以查阅完整手册内容 。
