发布时间:2019-2-28 分类: 电商动态
偶尔我看到一篇关于随机数的文章,所以我花了两个小时做这个小游戏:石头剪布,还记得儿时的童年?游戏的逻辑就像操作一样简单。
实现:
整个游戏主页包括动态面板,主页内容页面的一个状态和历史页面的一个状态。
整体流程:
整个过程非常简单,用户选择一个作为自己猜测的结果,然后背景随机生成一个结果然后进行匹配,匹配结果给出不同的提示。
全局变量:
主页:
在主页的右上角是历史记录按钮,单击进入历史记录页面。
图片区域是一个动态面板,其中包含图片的初始状态,随机运动显示,以及点击石头,剪刀,布料图标后的不同图片,以及通过点击剪刀和布料出现的图片是Bing车站的日常图片界面。图中,这两张图片每天都会改变,不能直接添加到Axure中,通过修改html代码来实现。
1.石头,剪刀,布料图标
在图标选择下设置交互式效果。
石头图标:
剪刀图标:
布料图标:
单击图标更改图片区域面板的状态,选择当前图标,记录当前值(设置文本框值:图标[此代购源码网站使用fontawesome字体,因此该值可以直接记录为三个图标];全局变量选择=1,选择剪刀布分别设置为2,3)显示所选结果(文本标签cd为显示结果)
此操作是停止随机运动。如果没有设置,随机动作将在猜测完成后继续,并且设备资源的消耗将导致发烧热和hellip;
2.图像动态面板区域
共有6个州:
空:初始图像
计算:随机效应
结果:显示随机匹配选择的结果
B1:点击石头显示的图像
B2:点击剪刀显示的图片
B3:单击布料上显示的图像
动态面板状态更改的交互式描述:
返回结果在结果显示状态下接收随机结果,sys-radom文本框值接收与随机数对应的图标,为添加到历史页面的转发器做准备,例如,随机值为1, sys-radom的值对于石头图标(图标参考fontawesome)
判断随机值和选择值是否相等,并且如果显示相等信息等于另一个,则显示不相等信息。
计算动态面板状态时,将启动随机效果。
3.按下按钮
单击当前按钮而不单击任何图标会弹出错误框
单击任何结果图标并单击当前按钮以触发图像轮播以向上滑动到随机运动图状态,设置并生成随机值:
随机=[[Math.floor(的Math.random()* 3 + 1)]]
等待一秒钟将图像区域动态面板切换到生成状态
在历史页面转发器中添加一行以记录此猜测和随机值的结果
Repeater添加了过滤功能,使数据新数据显示在顶部
历史页面转发器设置:
历史页面:
单击“清除”以确认弹出窗口
确定按钮交互:标记转发器的全部内容,删除标记的内容,隐藏弹出窗口
源rp文件下载:https://www.lylares.com/shitou-jiandao-bu.html