axure8.0快速入门新手教程:公司年会抽奖器

2017年4月22日 阅读:345

互联网公司,最振奋人心的莫过于辛勤劳动一年后的公司年会,有money的公司总是在这个时候抽大奖,iphone,ipad,kindle等等总是送不断。那么,公司年会抽奖器的原型应该怎么做呢?这里就教教大家如何使用axure8.0制作公司年会抽奖器的原型。

第一步:拖拉摆放相关控件

首先,摆好相关相关背景,即一个心形和一行文字“一路同行,感谢同行”;

然后,一个中继器,中继器里面放有一个“name”和一个“phone”的文本框,两个文本框的边框都设为透明;

最后,160X40的开始按钮矩形。

第二步:添加页面载入时用例

1、设置OnLoadVariable的值为停止;

2、在中继器中添加10行数据;

3、根据sortid进行升序排序;

4、设置中继器的当前页为1。

第三步:为中继器添加每项加载时用例

设置“name”对应中继器数据库中的name列,设置“phone”对应中继器数据库中的phone列。

第四步:为开始按钮添加鼠标单击时用例

用例1:如果OnLoadVariable等于开始

1、设置OnLoadVariable等于停止

2、开始按钮的文字等于开始

用例2:如果OnLoadVariable等于停止

1、设置OnLoadVariable等于开始

2、开始按钮的文字等于停止

3、设置中继器当前页为next

第五步:为“phone”文本框添加文本改变时用例

用例1:OnLoadVariable等于开始,并且中继器的当前页码不等于总页码

1、等待100毫秒;

2、设置中继器当前页为next。

用例2:OnLoadVariable等于开始,并且中继器的当前页码等于总页码

1、等待100毫秒;

2、设置中继器当前页为1。

预览中点击开始按钮就可以看见年会抽奖器的动画效果了。同时也可以随时关注我的个人博客:http://weidublog.com,因为工作过程中有很多这些axure原型设计小技巧的例子,所以我会坚持分享下去,希望对大家有帮助,你们对我的关注就是我的动力。

效果图:axure原型设计之公司年会抽奖器
更多原型案例:http://weidublog.com/index.php/2017/03/20/181/

作者:维度
转载请注明出处:http://weidublog.com/index.php/2017/04/22/510/

没有评论

评论已关闭。