• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >axure > 用Axure模拟一个数字抽奖的小游戏

用Axure模拟一个数字抽奖的小游戏

作者: @ChrisWong 字体:[增加 减小] 来源:互联网 时间:2017-06-14

本文主要包含axure小游戏,axure做小游戏,小游戏数字签名错误,数字指法练习小游戏,儿童游戏数字小游戏等相关知识, @ChrisWong 希望在学习及工作中可以帮助到您

axurezujiakudf

Axure作为原型工具,功能齐全而且简单易用。我作为刚刚毕业的小白,简单学了几个功能后,今天为大家展示一个用Axure模拟数字抽奖的游戏。数字抽奖的规则是每点击一次抽奖就会随机出现三个数字,每个数字都是0-9之间的个位数。当然了你也可以继续按照规则设置更多数字的抽奖游戏。下面是干货阶段!

第一步

按照如图添加各个元件,并为每个元件命名:

第一步

第二步:

设置全局变量,并命名为A(记住全局变量只能命名为英文哦)

第二步

第三步

第三步:

为抽奖按钮设置交互动作。点击抽奖按钮,选择鼠标单击时的用例。然后选择设置变量值,勾选A,再选择fx,如下图所示。

第四步1

第四步:

添加函数random();random函数主要是随机产生0-1之间的小数。

第四步2

但是我们是要生成0-9之间的整数,这时就需要将0-1之间的小数变为0-10之间的小数,即为原数的10倍。那么我们只需在random函数上乘以10即可。

第四步3

第五步:

我们虽然生成了0-10之间的小数,但是还是有小数部分啊,那么接下来我们就需要去掉小数部分。这里是整个操作最难的部分,但是也只是一个函数而已。我们需要设置一个复合函数来去掉小数部分。首先是字符串函数substring(),其用途为从当前文本对象中截取从指定位置到另一个指定位置区间的字符串,但是右侧位置不截取。所以我们只需要将小数从第一位截取到小数点即可。所以我们的函数表达式为[[A.substring(0,1)]]。这样就可以只截取第一位有效数字。

QQ截图20160922160538

第六步:

将随机数显示到一级标题上,选择富文本并编辑文本,插入变量A

1

2

第七步:

这样我们就可以预览下,发现点击抽奖按钮是可以产生0-9之间的随机数的。

第七步

第八步:

按照上述步骤设置好另外两个位数即可。

第九步:

为了好看,这里选择隐藏三个一级标题。

3

第十步:

继续添加抽取按钮的交互动作,让三个一级标题显示出来。

4

看看效果是这样子的

5

这样我们就已经全部完成整个随机数的抽取。

您可能想查找下面的文章:

  • Axure中继器实践:如何制作一个「记忆翻牌」小游戏?
  • 用Axure模拟一个数字抽奖的小游戏

相关文章

  • 2017-06-14Axure教程:滑动鼠标页面自动切换(一)
  • 2017-06-14banner轮播axure最简易实现及手动切换
  • 2017-06-13Axure中继器姊妹篇:列表页添加排序和筛选功能
  • 2017-06-14用Axure 实现“打飞机”,骚年,来一发(上)
  • 2017-06-14Axure7.0教程(八)函数介绍
  • 2017-06-13Axure教程:原型设计之播放控制条
  • 2017-06-14高手在民间 | 手把手教你用Axure制作连连看游戏(附游戏地址)
  • 2017-06-13Axure原型设计之轮播图
  • 2017-06-13Axure实例:Axure Pro 8制作产品需求文档
  • 2017-06-13Axure教程:实现倒计时获取验证码效果

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • Axure教程 | 如何通过拖动滑杆上的按钮,调整数值?
    • 中继器实践:双向列表操作
    • Axure中继器的基本使用:实现一个简易的人员添加、删除模块
    • Axure 7高保真还原Web首页布局和交互教程
    • Axure教程:手把手教你做截获鼠标指针(或鼠标变手型跟随)
    • Axure教程:如何画出曲线图?
    • Axure教程 | 原型中的商品图放大镜效果
    • Axure 8.0 实例 | 模拟一个上传图片的原型
    • Axure教程|原型设计之抽屉列表
    • Axure8.0实例:简单实用的验证码

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有