【超级干货】Axure学习总结之功能篇

（一）变量应用

本章节以实现“网页倒计时”动画效果为例，了解变量的使用方法。

可登陆http://uyn25u.axshare.com查看演示效果，密码pqq123

1. 变量创建

Axure的变量有两种，一类是全局变量，在全局范围内有效，另一类是局部变量，只在定义它的部件范围内有效。

1.1 全局变量

全局变量主要用于实现不同页面间的数据传递。一个原型文件中，定义的全局变量建议不要超过25个。

位置：线框图——管理全局变量，可在管理界面，增加、删除、编辑全局变量。

1.2 局部变量

局部变量一般在交互中被使用，因此可在编写交互事件时定义。

1）可在条件分支中定义，如下：

在出现 的地方，均可点击进入变量编辑页面。如下：

下面的区域为局部变量编辑框，可添加、删除、修改局部变量，并可设置变量的初始值。

上面的区域为变量应用区，可设置变量及对应的函数表达式。

2）可在值编辑器中定义，用例编辑器——设置变量/部件值——打开设置值编辑器。

2. 变量应用

下面以实现“网页倒计时”动画效果为例，了解变量的使用方法。

【效果描述】

从01时01分00秒开始倒计时，动态显示倒计时效果，如01时00分59秒、01时00分58秒、01时00分57秒……

【设计描述】

倒计时的持续需要循环的支持，我们可以利用动态面板的显示和隐藏事件来实现循环。

1）在面板显示时改变相应数值，然后让面板隐藏，触发隐藏事件。

2）面板隐藏时等待1000毫秒用来实现读秒效果，再让面板显示，触发显示事件。

3）如此循环往复，即可实现倒计时效果。

【实现过程】

1）将需要的部件拖动到页面上。

6个文本面板，其中3个用来标识时、分、秒，实现数字的动态显示；

1个开始按钮，触发倒计时；

1个动态面板，实现循环。

2）设计开始按钮点击事件。

切换动态面板可见性，触发动态面板显示事件。

3）设计动态面板显示事件。

实现倒计时效果。当分减1时，秒从59开始；当时减1时，分、秒都从59开始。

当时、分、秒的长度小于2时，如为5，则在前面补0，变成05。

切换动态面板可见性，触发动态面板隐藏事件。

4）设计动态面板隐藏事件。

先等待1000ms，实现读秒效果，再切换动态面板可见性，触发动态面板显示事件。

至此设计完成，可运行看执行效果了~~~

其实，上述动态效果也可以用3个全局变量实现，不过对于页面较多、交互效果较为复杂的原型而言，能用局部变量实现的，尽量不要用全局变量，因全局变量数量有限，且全局变量运行效率没有局部变量的高。