《Axure动态面板模拟摇骰子》是一篇关于Axure的学习教程,通过简单几步就能实现教程中的效果图效果,当然只学习这一点,并不能完全掌握Axure技巧;你可以通过此加强操作实例,按钮,交互产品,文本等多维度案例或实操来进行更多的学习;此教程是由吉吉在2021-06-29发布的,目前为止更获得了 0 个赞;如果你觉得这个能帮助到你,能提升你Axure技巧;请给他一个赞吧。
今天教大家如何用Axure动态面板模拟摇骰子,骰子是许多娱乐必不可少的工具之一,通常作为桌上游戏的小道具,最常见的骰子是六面骰,感兴趣的小伙伴快来尝试一下吧!
操作实例:
你将学到的东西:
本教学原理:
1. 绘制如下三个元件
2. 设置[控制随机]动态面板交互
①[控制随机]新建交互状态改变时,设置文本[随机数字]文本框=[[(6*())]]
函数解释:
():即随机产生0-1内的随机数,前面加6*,即随机产生0-6随机数
(x):即取整
本函数的意思是取0-6之间的随机正整数
3. 设置[开关按钮]交互
①[开关按钮]点击时,情形1,如果[按钮开关]元件文字为“开”,则执行以下条件:设置[控制随机]动态面板到下一项,循环间隔100ms。设置文本[开关按钮]元件文字为“关”
②[开关按钮]点击时,情形2,如果[按钮开关]元件文字为“关”,则执行以下条件:设置[控制随机]动态面板停止循环。设置文本[开关按钮]元件文字为“开”
④看看效果
每100ms变换一次数字
绘制骰子
①绘制六个骰子
②填充颜色后,创建一个动态面板,命名[骰子],添加六个状态,分别把六个骰子放到六个状态里。
③设置[控制随机]输入文本框交互,文本改变时,添加六个情形,当[随机数字]输入文本框=1时,设置[骰子]动态面板为状态1,依次类推。
设置六个情形:
④看看效果
这样[骰子]动态面板会随着文本框的改变而改变,这就是利用输入文本框的“文本改变时”的妙用。
由于骰子在运动过程中,既有旋转,又有位移,且随开关控制,其实很简单,我们只需要在[控制随机]动态面板增加两个动作:
旋转[骰子]经过60°,动画线性100ms
移动[骰子]到达X=[[(100*())]],Y=[[(100*())]],动画线性100ms。这个函数的意思就是移动[骰子]在100*100范围内随机移动
看看效果:
最终效果1:
最终效果2:
大家思考一下怎么实现,原理很简单
以上就是Axure动态面板模拟摇骰子全部内容介绍了,关于更多axure9教程信息,欢迎关注北极熊素材库,给你带来最丰富的素材图片和最有用的教程,更多最新资讯。
赠人玫瑰,手有余香
< 上一篇 Axure制作APP折叠面板 axure手风琴制作教程操作实例
> 下一篇 Axure模拟拨号键盘制作
2022-06-07 09:06
2022-02-22 14:32
首席设计师
高级视觉设计师
高级插画设计师
输入的验证码不正确
评论区
暂无评论