axure怎么做左右切换图片(如何用axure更改一个图片)

Axure能用动态面板做出如图效果展示么，要能切换的。

你用动态面板，然后设定他的动作，如果是刚载入就要切换就写在页面的ONLOAD里面，先写一个等待比如10S然后切换动态面板的状态，从1到2，然后在动态面板的动作里面（当切换状态时触发），然后里面写剩下的切换

Axure8怎么设置动态面板左右晃动？为什么只有“经过”和“移动”两个选项，没有Axure7.0里

有相对移动，移动实例里可以进行选择是绝对位置还是相对位置：

axure怎么做水平或者垂直移动效果

一位有PC端原型设计经验的产品人员，设计移动端产品原型时，遇到的第一个问题可能就是页面拖动的效果了。我们在设计PC端产品时，利用鼠标滚轮进行整个页面的展示，然后到了移动端，利用手指进行拖动，滑动展示整个页面。两种交互方式截然不同。

axure制作移动端产品原型时，会遇到很多难题，建议产品同事尝试一些诸如mockplus等更适合移动端的原型设计工具。当然，axure是完全可以实现移动端交互的，只是我们需要利用动态模板、坐标定位等等方式灵活的实现目标。

接下来进入主题，跟大家分享一下【如何利用axure实现移动端页面拖动展示效果】

打开axure前，大家不妨先设想一下任务的实现方法：

1、移动端显示的页面是固定尺寸的，里面的整体页面可能会超出固定尺寸范围，所以我们需要建立一个动态模板，使其成为固定尺寸的页面，而将超长的整体页面放入其中。

2、整体页面必须可以被拖拽，所以整体页面又是一个动态面板

3、在我们使用移动端产品，进入页面后，向下拖拽，一般页面会被下拉，而且上方会出现【放开刷新】的提示；同理，我们手指上滑，页面被拖至底部，再不停上滑，页面会被上拉，手指放开后，页面下滑至原位。所以我们axure中对整体页面的动态模板需要设置离开顶部或者离开底部时，自动返回原位的交互

这三个实现方法，是我们实现拖动交互的主要思路。接着我们就具体看一下如何在axure中实现目标。

1、准备工作：打开axure，新建文档，添加一张iphone的背景素材，顶部添加的wifi和电量的信息，以及顶部导航栏（这些素材百度都可以找到，ios8 UIkit），准备工作完毕

2、??添加一个动态面板，这个面板相当于我们的屏幕，所以名字可以称为“固定页面”

3、??动态面板内再添加一个动态面板，这第二个面板相当于我们要展示的内容，需要拖动才能展示整个内容，长度自然也比“固定页面”要长，可以称之为“长内容”

4、??长内容的面板内添加正文内容，这里我添加了一张图片

5、??接下来先实现长面板的拖动功能，在固定页面内对长内容面板添加onDrag交互，交互的内容是move，而且move with y,也就是长面只能沿着Y轴拖动

6、??拖动功能已经实现，我们可以先预览一下已经完成的效果（点击axure操作栏的Preview按钮），尝试着上下拖动图片，结果符合预期，只是拖动后，图片不能复位，那么接下去就要实现复位的功能

7、??为了实现复位，我们需要在固定页面的顶部和底部添加两个判断用的矩形。顶部的矩形我们暂且称之为“上离开判断区域”，顾名思义，当长内容面板向下拖动，离开“上离开判断区域”，长内容需要move到原始的"0,0"坐标，这个交互我们称之为“下拉复位”。判断区域可以设置为透明，与长内容同宽，高度为象征性的2px

8、??选择长内容面板，在onDrag动作中添加新的交互“下拉复位”，增加触发条件：当area of widget 长内容 ? ?is not over ? ?area of widget 上离开判断区域。那么首先wait 400ms，接着move 长内容，编辑结果 move to X：0 ? ? Y：0。

注意：编辑完下拉复位后，这里有一个很重要的改动，在交互栏中，右击将“下拉复位”的else if条件更改为if。必须这样做，不然下拉复位的动作无法实现。至于这样做的原因，就留给大家思考吧。

9、??上拉复位的动作完成后，我们还要实现下拉复位。首先我们添加一个判断框，边框与填充均为透明，尺寸为长内容的宽度与象征性的2px，定位于固定页的底部

10、??在实现下拉复位的时候，我们给长内容的复原位定为X：0和Y：0，这个很容易理解，长面板向上复位时肯定移动到（0,0）的位置。但现在实现上拉复位，我们需要计算长面板的高度，这是因为长面板拖到底部后，固定页面显示的是长面板的下部分内容。这里可能有些费解，看我的截图也许能帮助理解

11、??经过上一步的操作，我们得知当整个长内容显示到最底部时，整个长内容的定位为（0，-295），接下去就和实现下拉复位一样了，在交互栏onDrag动作中添加交互“上拉复位”，添加触发条件 ??当area of widget 长内容 ? ?is not over ? ?area of widget 下离开判断区域。那么首先wait 400ms，接着move 长内容，编辑结果 move to X：0 ? ? Y：-295。

编辑完上拉复位后，在交互栏中，右击将“上拉复位”的else if条件更改为if。

12、??所有条件编辑完毕，查看一下交互栏onDrag动作中的所有交互

13、??大功告成，赶紧运行一下观察效果

总结：

利用axure实现移动端最基本的上拉与下拉动作是如此复杂，所以我还是建议利用其它原型工具制作移动端原型。然而即便如此，axure还是有其优势，实现静态的页面要比其它原型工具都要便利。

这次的功能实现，还有很多能提升的提升的地方，比如复位的时候，我们可以添加动效，使得复位时页面的移动更加平滑。诸如此类的改进，还是留给热爱axure的大家去探索吧。