整个游戏主页由一个动态面板构成,一个状态存放主页内容页,一个状态下存放历史记录页。
整体流程:整体流程十分简单,用户选择一个作为自己猜测的结果,然后后台随机生成一个结果再做一次匹配,匹配结果给出不同提示。
全局变量:1.石头、剪刀、布图标设置图标选中下的交互效果。
石头图标:
剪刀图标:
布图标:
2.图片动态面板区共6个状态:
null:初始图片
calculating:随机动效
result:随机后匹配选择的结果展示
动态面板状态改变的交互说明:
return-result位于结果展示状态下接收随机的结果,sys-radom文本框值接收随机数字对应的图标,为添加到历史页面的中继器里做准备,比如随机值为1则sys-radom的值为石头图标(图标参考fontawesome)
判断随机值和选择值是否相等,如果相等显示相等信息反之显示不相等信息。
当动态面板状态为calculating时,开始随机动效。
3.猜一猜按钮random=[[(()*3+1)]]
等待一秒后切换图片区动态面板为结果状态
给历史记录页面中继器添加一行,记录本次猜的结果与随机值
中继器添加筛选使得数据新的数据展示在最上方
历史页面中继器设置:
历史记录页面:
确定按钮交互:标记中继器全部内容,删除已标记的内容,隐藏弹窗
源rp文件下载:
本文由@小白不吃菜原创发布于人人都是产品经理。未经许可,禁止转载。
题图来自Pexels,基于CC0协议