手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

如何用Axure RP 8.0 制作时间60秒倒时计

时间:2024-10-15 09:53:20

1、拖出来两个文本标签,一个在里面写入数字10,并命名为time,另一个写入文字“秒后自动进入下个页面”

如何用Axure RP 8.0 制作时间60秒倒时计

2、拖出来一个动态面板,命名为round,双击动态面板,里面已经有一个动态面板State1,再添加一个State2,分别设置两个面板的背景色为红和蓝,用于演示效果,点击确定

如何用Axure RP 8.0 制作时间60秒倒时计

3、双击动态面板round的"状态改变时"事件,在弹出的窗口中点击“添加条件”,设置“元件文字”time > 值 0,然后点击确定

如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计

4、紧接着在添加动作列中点击“设置文本”,在右边配置动作中勾选time元件,然后点击右下角的fx,添加局部变量LVAR1=元件文字time,然后再插入变量[[LVAR1]],然后修改为[[LVAR1-1]],然后点击确定

如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计

5、点击index页面空皈寿凿几白处,双击“页面截入时”事件,在弹出框中添加动作"设置面板状态“,在右边勾选round动态面板,选择状态”Next”,勾上“向后循环”,“循环间隔1000毫秒惯墀眚篪”及“首个状态延时1000毫秒后切换”,然后点击确定

如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计

6、点击动态面板,再次点击”状态改变时“事件,添加页面跳转,添加条件,当time值=0时,跳转到page1

如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计

7、好了,点击预览,即可看到效果了,真正使用的时候,可以把动态面板round隐藏即可。

如何用Axure RP 8.0 制作时间60秒倒时计
如何用Axure RP 8.0 制作时间60秒倒时计
© 手抄报圈