antd 轮播图样式_Axure特效之轮播图

轮播图是使用非常多的一个场景，无论是pc端网站还是移动端，都会使用到轮播图，使用axure来制作轮播图有很多种方式，今天就由我带大家实现轮播图。

按照老习惯，我们先看看做好以后的效果。

【需求分析】

通过上面的演示，我们得出该轮播图的需求如下：

1、要实现三张图片的自动轮播，并且在轮播的时候选中对应的按钮；

2、点击轮播图上的按钮，就会自动切换到对应的图片；

【实现思路】

1、图片的轮播我们通过动态面板来实现，动态面板三个状态，每个状态都有一副图片；

2、对于用户点击导航按钮，就切换到对应的图片，我们通过按钮的点击事件实现，即点击对应的按钮，设置面板状态为对应的图片；

3、至于按钮的选中状态，我们可以使用按钮的交互样式实现，即设置每个按钮的交互样式，当点击对应按钮的时候，设计按钮为选中即可；

4、这里还有个重要的地方，例如有a、b、c三个按钮，如果a按钮选中，那b、c按钮就要取消选中，这里我们利用元件组的思路，a、b、c按钮设置为同一一个按钮组，这样的话同时只有一个按钮被选中；

5、还有一个关键的问题是如何实现自动轮播&#x