Lines Matching refs:swiper

1 # swiper开发指导
4 swiper为滑动容器，提供切换显示子组件的能力。具体用法请参考[swiper](../reference/apis-arkui/arkui-js/js-components-container-s…
7 ## 创建swiper组件
9 在pages/index目录下的hml文件中创建一个swiper组件。
14   <swiper>
24   </swiper>
39 swiper{
61 > swiper组件支持除&lt;list&gt;之外的子组件。
66 swiper组件当不开启循环播放（loop="false"）时添加自动播放属性（autoplay），设置自动播放时播放时间间隔（interval），页面会自动切换并停留在最后一个子组件页面。添加di…
72   <swiper index="1"  autoplay="true" interval="2000" indicator="true" digital="true" duration="500"
86   </swiper>
101 swiper{
122 > - swiper子组件的个数大于等于2时设置的loop属性才会生效。
129 设置swiper组件的宽高，导航点指示器的直径大小（indicator-size）、颜色（indicator-color）、相对位置（indicator-top）及选中时的颜色（indicator-…
135     <swiper index="1" autoplay="true" interval="2000"  duration="500" >
145     </swiper>
160 swiper{
188 …子组件）或showNext（显示下一个子组件）方法。添加select组件下拉选择时触发change事件后调用swipeTo方法跳转到指定轮播页面。swiper组件绑定change（当前显示的组件索…
194   <swiper interval="2000" onchange="change" loop="false" onanimationfinish="finish" id="swiper">
207   </swiper>
232 swiper{
274     this.$element('swiper').swipeTo({index: Number(e.newValue)});
277     this.$element('swiper').showPrevious();
280     this.$element('swiper').showNext();
290 本场景中使用swiper创建一个轮播图，在轮播图底部制作一个缩略图，点击缩略图后调用swipeTo方法切换到对应的轮播图。
296   <swiper duration="500" indicator="false" id="swiper" onchange="change">
300   </swiper>
319 swiper{
359     this.$element('swiper').swipeTo({index: index});
372 针对swiper开发，有以下相关实例可供参考：