品牌型号：联想Yoga 14Sitl

系统：Windows 10 64位专业版

软件版本：Axure rp 9

轮播图也叫Banner图，在网站的首页经常可以看到，可以用来展示营销信息。图片放大可以帮助我们更清楚的看清产品细节，在电商网站的商品展示页面中会经常遇到。

一、Axure怎么制作轮播图

在Axure RP中，制作轮播图要用到动态面板元件。这种元件在Axure中非常重要，能够帮我们实现多种效果。动态面板需要配合交互设置才能发挥它的作用。通过动态面板和设置，我们能够轻松实现轮播图的制作。下面给大家介绍制作轮播图的三个步骤：

1、准备素材。为了快速上手，我们做一个只有三张图片轮播的轮播效果。我们首先要准备用于轮播的图片素材，将图片拖拽到Axure的画布中。接着，我们在默认元件库中找到矩形元件，调整大小，这个矩形的大小就是接下来轮播图的显示范围。例如图1中的矩形是462*260像素。

2、使用动态面板。动态面板的使用有两种方式，第一种是直接在默认元件库中找到动态面板元件，将它拖拽到画布中使用。第二种方式是将普通元件转换为动态面板，我们采用第二种方式进行制作。选中矩形后，点击鼠标右键，在上下文菜单中找到【转换为动态面板】命令。点击后，矩形会变成蓝色的显示，说明转换完成。

①对于动态面板的使用，要把它理解为一个显示屏幕。它会分成不同的状态。双击动态面板，进入状态编辑模式。

②默认情况下会自动创建State1，也就是状态1，我们要把参与轮播的第一张图片放到状态1中。可以在概要面板选中第一张图片后拖拽到动态面板的层级中。删除原本的矩形，因为这个矩形只是用来规划范围的，动态面板创建后就失去作用了。

③在动态面板的编辑状态中，点击上方State1位置，再点击添加状态。

④创建State2，置入第二张图片，创建State3，置入第三张图片。

3、设置交互事件。在没有选中任何元件的情况下（此时选中的是整个页面），在右侧交互面板中找到【页面载入时】事件。设置交互的目标为我们之前准备好的动态面板。在状态列表中，我们不是要让动态面板固定出现哪一个状态，所以我们选择的显示是【下一项】，并且勾选向后循环，这样轮播图能够自动切换到下一个状态，完成自动播放效果。同时，设置了向左滑动效果和500ms的切换速度。

4、预览测试。点击工具栏中的【预览】按钮，在浏览器中查看效果。网页打开后，轮播图能够自动播放，说明设置正确。制作轮播图的案例我们就完成了。

二、Axure怎么做图片放大动效

在电商平台和产品展示中，放大图片功能能够让我们更直观地了解产品的材质、纹理和细节。接下来，我们通过以下三个步骤来制作图片放大的效果。

1、插入图片。先准备好图片素材，拖拽到画布中，调整好它的大小和位置。为了给放大效果留出展示空间，我们尽量先缩小素材图片的尺寸。例如下图9中，初始图片尺寸为179*101像素。

2、交互事件设置。我们要实现的是，当鼠标进入图片范围的时候，图片放大。因此，我们要给图片元件选择的交互触发事件是【鼠标移入时】。移入时，进行的动作是【设置尺寸】。在尺寸数据中直接加个0就能够让图片放大十倍，锚点改选为中心点。动画选择的是线性，速度为500ms，这样设置的话，放大过程是可见的、缓慢发生的。我们可以根据实际案例的需要，调整图片放大的速度。

3、预览测试。点击预览后，我们可以在浏览器查看效果。页面加载后，可以看到图片缓慢变大了，说明放大的动效实现了。

以上就是Axure怎么制作轮播图，Axure怎么做图片放大动效的相关内容。在网页中加入轮播图可以展示更多的内容，方便更好的营销。而用Axure制作图片放大的原型效果，可以更细致的展示产品的细节。