Axure原型工具如何制作倒计时效果

 时间:2024-10-19 13:18:56

Axure原型工具如何制作倒计时效果水貔藻疽,实现这个效果需要使用到动态页面的next循环播放及停止的设置,具体如何做,小编一步步介绍给大家。

工具/原料

电脑

Axure

方法/步骤

1、首先新建一个空白页面,在工作区域拖入相关元件元素,主要是动态页面,如下图所示。

Axure原型工具如何制作倒计时效果

2、将元件的名名称及样式进行设置,如下图所示,可以将文字描述修改为“本网页将在几秒之后关闭”,并将动态页面缩小命名为number。

Axure原型工具如何制作倒计时效果

3、然后打开动态面板,在state1中输入数字5,如下图所示。

Axure原型工具如何制作倒计时效果

4、同样的方式,复制出4个state,并分别输入4,3,2,1,如下图所示。

Axure原型工具如何制作倒计时效果

5、动态面板中的值输入完成了,下面开始进行属性事件交互的设置,这里我们在页面载入时做交观立挛蛴互事件就可以了,首先页面载入时等待1000毫秒,如下图所示。

Axure原型工具如何制作倒计时效果

6、等待过后,开始对动态面板进行循环播放,如下图所示,设置状态为Next,并对其他属性进行设置。

Axure原型工具如何制作倒计时效果

7、如果你做的是关闭某页面或跳转某页面的时鸷雄凰堆候,此时就可以用条件判断的方式直接关闭或跳转页面就可以了,当然不关闭你可以让数字到1的时候停止,这里需要设置,如下图所示。

Axure原型工具如何制作倒计时效果

8、这样就可以了,我们看一下最终的效果,f5预览一下,如图所示。

Axure原型工具如何制作倒计时效果

Axure原型工具如何制作倒计时效果

如何用Axure制作动态倒计时 axure如何设计倒计时 Axure怎么实现页面载入时元素旋转效果 Animate/FLASH如何实现水平拖动图片(AS3) AE渐变起点怎么设置
热门搜索
死囚乐园漫画 恶搞美女漫画 烤瓷牙图片 绝世唐门2漫画 民国纸币图片及价格