Axure7.0教程:實現猜數字小游戲
最近在學Axure,看到一篇關于數字抽獎的教程,于是在此基礎上擴展了一些功能,增添了一些游戲元素,游戲規則如下:
- 初始金幣為100,每次抽獎花費10金幣
- 輸入1位數字點擊抽獎,如有1個開獎數字與輸入數字相同,獎勵20金幣,兩個相同獎勵40金幣,3個相同獎勵60金幣
- 金幣為0,則無抽獎機會
原型效果:點我抽獎
下面簡單介紹一下制作流程:
1.設置全局變量和添加元件
設置全局變量
- suijishu:用來記錄保存隨機數
- jinbi:金幣數量,初始值100,每次抽獎減10
- cishu:抽獎次數,初始值0,每次抽獎加1
添加元件及命名
- shuru為單行文本框,設置最大文字數為1;
- one、two、three為矩形框調整為圓形,可根據自己興趣調整形狀和填充色,設置為隱藏,單擊抽獎方可顯示;
- choujiang按鈕下方設置tishi,用以顯示中獎、沒中獎、金幣用完等信息
2.添加點擊事件
所有的點擊事件都是基于“點擊抽獎”實現,選擇“choujiang”,設置鼠標單擊時事件
用例1:產生隨機數
設置條件為:
- 顯示one、two、three(之前未隱藏的話不用顯示)
- 移動第一個圓one,使其產生上下晃動效果
- 使用random和substring函數給全局變量suijishu賦值,使其產生0-9的隨機數,并把數字賦予第一個圓one
- 移動第二個圓two,使其產生上下晃動效果(時間比第一個久一些)
- 用random和substring函數給全局變量suijishu賦值,使其產生0-9的隨機數,并把數字賦予第二個圓two
- 移動第三個圓three,使其產生上下晃動效果(時間比第二個久一些)
- 用random和substring函數給全局變量suijishu賦值,使其產生0-9的隨機數,并把數字賦予第三個圓three
- 設置變量值jinbi=jinbi-10,cishu=cishu+1
- 把加減后的變量值賦予元件jinbi和cishu
用例2:中獎
3個圓的中獎事件是平行且獨立的,分別判斷輸入的數字是否與該圓賦予的隨機數相同,如果相同,金幣數加20,可最高累計加60。
以第一個圓的中獎事件為例:
設置條件
其中[[sr]]為局部變量,元件shuru的文字;[[one]]為局部變量,元件one的文字。
- 設置tishi文字為“恭喜您!中獎啦!”
- 設置變量值jinbi=jinbi+20
- 把更新后的jinbi數值顯示在元件jinbi上
- 提示文字設置為800ms自動消失
第二個圓和第三個圓的用例和第一個類似,可直接復制修改。
用例3:沒中獎
設置條件
- 設置tishi文字為“很遺憾!再來一次!”
- 左右晃動抽獎按鈕
- 提示文字設置為800ms自動消失
用例4:金幣用完
設置條件
- 設置tishi文字為“嗚嗚嗚~金幣用完啦~”
- 禁用shuru文本框,重要!(不然金幣為0時可修改輸入框與下方數字相同,繼續游戲)
用例5:輸入框為空
- 設置條件:如果shuru=“”
- 設置tishi文字為“請輸入1位數字!”
- 左右晃動抽獎按鈕
- 提示文字設置為800ms自動消失
3.補充說明
- 上下左右晃動效果純屬XX,如嫌麻煩可忽略之
- 各用例的設置條件并未詳細說明原因,其實都是在做的過程中填的一個個坑
- 周圍有個小伙伴最多玩到100多次,有人打破記錄嗎?
本文由 @你猜我是誰 原創發布于人人都是產品經理。未經許可,禁止轉載。
評論
親愛的,求原型文件學習,183919886@qq.com謝謝!
求原型文件學習,511902736@qq.com謝謝!
求原型文件學習,1039738600@qq.com謝謝!
已發
求原型文件學習!2449947607@qq.com謝謝??!
能不能給我發個H5或者原型文件,992794436@qq.com,謝謝
已發,請查收
收到,相當感謝
大神,能給我發一份么?謝謝了850267532@qq.com
已發,請查收
大神 能不能發一份原型給我,謝謝!408967884@qq.com
不用了,謝謝大神
?? 噢,肉,用8.0做,3個圓形后面兩個會亂跳是我哪里操作錯了還是版本問題呢??求看見~求回復~~謝謝~
本來設計的就是讓3個都上下晃動呀,模擬一個滾動抽獎的效果,只是第一個晃動時間最短,最后一個最長,如果不想要上下晃動效果,把用例1中移動onetwothree的語句刪掉就好
呃~~~我描述的有問題,是會晃動到別的位置恢復不了這樣,就不是水平晃動,只有one是水平晃動,其他都跑到其他地方卡主了這樣~我確認了邏輯和語句,沒有發現問題,所以請教一下是不是哪里還有不對的地方~~
不是上下晃動嗎,另外檢查移動語句是否少一句,正負正負最后加起來應該是0的(才能保持原位置不變),實在不行就把移動語句刪了吧
?? 剛剛重新寫了移動的又可以了~應該是我哪里寫錯了~就抽風啦~~ 感謝~~
有什么意義 費這大緊 幾句話描述完了
從程序員的角度來看,代碼不規范