如何使用Axure:[6]实现图片自动轮播
很多网站上都有那种图片自动切换/轮播的板块,由于在钽吟篑瑜Axure中没有现成的组件库,所以很多人想要实现这一效果时,就会比较迷茫。此篇为大家演示如何使用Axure自己实现图片自动轮播的效果。
工具/原料
Axure
准备
1、打开你自己的组件库,并新建一个名叫「ImagePlay」的空白页面
![如何使用Axure:[6]实现图片自动轮播](https://exp-picture.cdn.bcebos.com/1f03436b04d14929a5f86ea063e5eceeacbc7ec7.jpg)
3、将这个图片转换为动态面板,并命名这个动态面板为「ImagesFrame」
![如何使用Axure:[6]实现图片自动轮播](https://exp-picture.cdn.bcebos.com/05e24be983aee8d70e5ab45c6b781431deb666c7.jpg)
5、切换到每一个状态中,并加入要轮播的图片。
![如何使用Axure:[6]实现图片自动轮播](https://exp-picture.cdn.bcebos.com/3fc72e486143d7d4254153587da75f0f832b50c7.jpg)
添加事件
1、分别为三个圆形添加事件,切换「ImagesFarme」到对应的状态中。并将这三个圆形为动态面板。,然后为每个圆形分别添加一个状态用于表姨胀兽辱示当前呈现的图片为哪个。并分别命名这三个圆形为Fist、Second、Third
![如何使用Axure:[6]实现图片自动轮播](https://exp-picture.cdn.bcebos.com/27725684cde34b2c2a9e2ccc0d0e7c75e4f443c7.jpg)
3、为「ImagesFrame」添加OnPanelSateChange事件用例,并添加限制条件,以保证「ImagesFrame」的状态与小圆形的状态能够一一对应。
![如何使用Axure:[6]实现图片自动轮播](https://exp-picture.cdn.bcebos.com/1562a0b9763e21c235a6b663e6e89a618725b1c7.jpg)
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
阅读量:27
阅读量:50
阅读量:92
阅读量:38
阅读量:40