预览: 一、元件准备1、添加两个中继器,分别用来存放双色的红球和蓝球,取名为“红球”和“蓝球”,初始时隐藏;
2、添加四个全局变量,分别取名为“red”、“blue”、“random”、“value”;4个全局变量的作用分别是:
3、添加7个椭圆形的元件,分别明明为“1”、“2”、“3”、“4”、“5”、“6”、“7”,用来存放开奖时随机抽取的号码,其中前6个为红色球,最后一个为蓝色球,并将这7个元件设置成隐藏; 4、最后,还需要一个按钮,命名为“抽奖”,初始文字内容为“开始抽奖”; 至此,所有的元件已经添加完毕,当然你也可以添加几个文字标签,让界面更加醒目,我这里偷个懒,就不加文字标签了。 二、添加用例1、首先给“抽奖”按钮添加用例“抽奖”按钮有两种情况:
我们可以根据“抽奖”按钮的文字内容去判断是不是为第一次抽奖。 (1)如果“抽奖”按钮的文字内容为“开始抽奖”,那么我们要执行以下用例: 1)给全局变量“random”获取一个随机值,且这个值有一定的限值条件,这个值的范围必须是:0~132,不能等于132,且必须是4的倍数。
2)给全局变量“value”设置值,因为“value”变量是用来存放“red”或“blue”变量中截取的号码的,在开始点击“抽奖”按钮时,一般是从红色球开始的,所以这里就要从“red”变量中截取抽中的红色球的号码,前面已经提到过,球的号码是通过<>开始和结束的,所以我们这里在截取球的号码值时是截取长度为4,通过字符串函数substr()截取; 3)取得第一个红色球的号码,椭圆形元件“1”是用来存放 第一个红色球的,所以就把第一个红色球的号码,赋给“1”。因为截取的号码包括<>的4位长度的字符串,我们这里只需要<>内的数值就可以了,所以还需要通过字符串函数substr()去截取“value”变量内的数值,数值的长度是2; 4)显示“1”。给“1”添加一个动画,这样更直观一些,我这里添加了一个“向右翻转”的一个动画,时间是1s,大家可以根据自己喜好自行设计; 5)设定“red”变量值。这一步很重要,目的是防止取到相同的红色球号码。双色球里,每个球最多只能取到一次,我还没见到过取到两个相同号码的红色球^_^,因为我们每次取红色球时,都是从“red”变量中截取的一段,所以每次在截取“red”后,就要把已经取到的这段字符串从“red”变量中去掉,这样就再也取不到这段字符串了,这样就避免了取到重复号码的红色球了。设定“red”变量值是通过字符串替换函数replace(),如果不明白replace()函数的用法,大家可以问下度娘,它可是无所不能的哦; 6)添加“红球”中继器。这一步的目的是为了后续生成中奖号码排序用的。因为在axure中,貌似只能在中继器红可以排序(双色球开奖时的号码是随机的,开奖过程中并不是按大小出来号码的,而是在中奖号码全部出来之后才按照大小排序的)。我们把“1”元件的文字内容添加到“红球”中继器中备用; 7)禁用“抽奖”按钮。我们点击“抽奖”按钮,已经开始抽奖了,总不能还可以再去点击“抽奖”吧,这样岂不是乱套了,所以,这里要把“抽奖”按钮置为禁用状态。为了更加直观,可以给“抽奖”按钮设置文字内容“抽奖中……”; 8)添加“触发事件”到“2”元件。Axure8.0中增加了一个“触发事件”的用例,可以直接通过“触发事件”去执行另外一个元件上的特定的用例,我们这里把添加的用例都在“鼠标单击时”,所以这里的“触发事件”触发的是“2”元件的“鼠标单击时”用例; (2)如果不是第一次抽奖,那么我们就要按照以下的方式处理“抽奖”按钮的用例了;
2、给“2”元件添加用例(1)等待1s。让两次取球有一定的时间间隔,具体间隔时间长短可自行设计。当然,也可以不设置,这样就直接获取所有的中奖号码; (2)给“random”全局变量获取一个随机值,规则同上,这里就不赘述了。不同的地方是取值的方为不一样了,因为在取得第一个球之后,“red”的值已经发生变化了(去掉了第一个球的内容),所以“red”的长度其实已经变化了,所以“random”的取值也要跟着变化,不然就可能越界了,取不到值了。至于为什么是这样取值的,大家可以思考一下; (3)“value”、“2”元件、“red”等内容的处理跟上面的是一样的,所以就不做过多的说明了; (4)添加“触发事件”到“3”元件。跟上面的添加“触发事件”到“2”是一样的。 3、给“3”元件添加用例除了“random”和添加“触发事件”到“4”元件之外,其余的同上。“random”设置如下: 4、给“4”元件添加用例除了“random”和添加“触发事件”到“5”元件之外,其余的同上。“random”设置如下: 5、给“5”元件添加用例除了“random”和添加“触发事件”到“6”元件之外,其余的同上。“random”设置如下: 6、给“6”元件添加用例(1)“random”设置如下: (2)设置“red”值为初始值。因为到此时红色球已经取完了,用不到“red”这个变量了,所以这里先把它设置成初始值。还记得“red”的初始值吧?如果不记得就往前面翻翻看; (3)添加“触发事件”到“7”元件,其他都一样; 7、给“7”元件添加用例(1)相同的部分就不说了哈,自行参照上面的即可; (2)“random”值设置如下,这里为什么是这样的?因为“blue”变量的值的长度是64嘛; (3)“value”值设置如下(看清楚了哦,这里是用的“blue”哈,不要问我为什么,不然我会打你的,因为“7”元件存放是蓝色球啊~); (4)把蓝球号码添加到“蓝球”中继器中去; (5)给红色球排序。习惯性动作,在排序之前先删除移除所有的排序,不要纠结为什么了,习惯而已; (6)至此,双色球的7个号码(6个红色,1个蓝色)都已经取到了,那么我们想要重新抽奖呢,肯定是要把“抽奖”按钮启用啊,因为不是第一次抽奖了,所以可把“抽奖”按钮的文字内容给重新定义一下嘛,这里就定义成“重新抽奖”了; (7)不光要把“抽奖”按钮给启用了,还要把排序后的“红球”中继器和“蓝球”中继器显示出来啊,不然怎么能算完事了呢(双色球开奖的红色球号码是有顺序的哦); 三、预览忙碌了现在了,如果看不到成果岂不是很伤心,所以,赶紧F5一下吧,看看自己的五百万是不是已经在路上了。当然,你也可以根据自己开奖的号码去福彩中心兑奖的了,前提是你要去彩票站买注双色球,而且还要中奖哦,不然会被打的,到时可别怨我哈。若要真的中奖了,可别忘记了我。^_^ PS:如果有什么问题,或者有什么想要实现的小功能,大家可以给我留言,我们一起学习! 本文由 @无泪 原创发布于人人都是产品经理。 |
|