天天打飛機沒意思,我來打個坦克【已補原型】

6 評論 8524 瀏覽 160 收藏 7 分鐘

看到一篇打飛機的文章,深受啟發,但是感覺飛機打太多傷身體,抽空試了試做了個打坦克的游戲。

1

玩法介紹:

上下左右移動,空格開火,可以攻擊右邊的坦克。

設計思路:

游戲嘛,首先要有主角,即我們的坦克。根據經典的紅白機坦克大戰來作為參考的話,坦克可以往上下左右四個方向進行移動,移動的時候,坦克的朝向也要跟著變化。

行走搞定后,接下來就要能夠發射炮彈。炮彈有兩種狀態,正常飛行和銷毀狀態。按下空格可以發射炮彈,碰到敵方坦克或邊界就切換成銷毀狀態。

接下來要做一個敵方坦克來做靶子,讓子彈碰到靶子后,靶子摧毀(隱藏)

思路有了,接下來開始制作。

1、首先制作出坦克,以及坦克上下左右的四個朝向,這個需要利用動態面板,添加四個狀態,每個狀態畫一個坦克,那么坦克四個方向的圖就有了。

2

1

2、接下來在頁面的全局事件上,加上按鍵事件,上下左右來開動坦克。

開動坦克的時候,根據按鍵方向,讓坦克移動一下,同時利用動態狀態設置,來達到改變坦克朝向的目的,用條件判斷按鍵,和移動就可以實現了。

1

3、好了,現在我們可以運行一下,看看坦克是否能正常行走。接下來就要讓坦克發射炮彈了。要注意,炮彈我們這里只做一發,因為太多的對象axure目前不支持太復雜的交互。炮彈的整個流程是:發射>移動>碰撞消亡。我們首先制作炮彈的發射和移動。炮彈的移動方向,首先是根據發射時的坦克朝向來判斷,然后自身再不停的循環移動。

開火時,我們可以通過獲取坦克的動態面板狀態,來獲取子彈的發射方向:

1

然后把這個方向的值,用設置文本動作,賦值給炮彈元件。

接下來,在子彈的移動事件上,寫上判斷當前炮彈元件的值是哪個方向,就讓炮彈往哪個方向移動10像素。

1

注意,要先設置等待50毫秒,再移動,這樣才可以觸發移動事件的不停循環。如果把這兩個動作顛倒,坦克就不會有動畫了。

做好之后,可以嘗試發射一下,看看子彈是否正常移動

4、接下來繼續在子彈的觸發器上加上碰撞檢測,碰到邊界或者敵方坦克后消亡。

首先制作出界判斷。我們可以利用條件判斷:局部變量來獲得子彈的坐標x和y,如果橫坐標小于0或者大于等于800,或者縱坐標小于0或者大于等于600就算出界。出界后,隱藏子彈(消亡)。

接下來用條件判斷:區域接觸,來判斷子彈是否接觸到了敵方坦克,如果接觸到了,子彈和敵方坦克同時消亡。

3

5、好了,到此為止我們的坦克會走,炮彈的移動也做好了。接下來就是要考慮如何進行炮彈的循環發射了。

axure8加入了觸發事件,我們可以用它來實現函數功能,這樣循環發射炮彈這種以前實現起來比較復雜的邏輯,現在可以利用函數來進行變相的if嵌套循環,這也是axure8制作復雜交互的一個重要亮點。

在按下空格時,首先調用子彈初始化函數(綁到單擊事件上),首先判斷子彈處于消亡狀態,即元件子彈可見不等于true,然后顯示子彈,并觸發子彈朝向設置函數(綁到雙擊事件上),然后將子彈的位置初始化到坦克的位置(還是用獲取元件坐標事件來實現,用加減法加入一個位置偏移量)。OK,到這里就大功告成了。

函數調用關系圖:

1

后記:

本人之前的職業是做網游設計的,現在axure越來越強大了,這個原型目前是初試牛刀,還有很多想加入的功能并未添加進來,比如是否可以結合數據集,做出刷怪器,坦克加入AI,地圖上增加磚墻等互動物件等等。如果有喜歡的人,后面可以一起來討論。

【20201124更新】

應某人要求補上最新原型預覽

最新原型文件:

作者提供:https://lanhuapp.com/url/hRCgj

密碼: g2Xl

 

本文由 @磊哥?原創獨家發布于人人都是產品經理?,未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 大神,原型文件的度盤都失效了。。。。。??梢灾匦律蟼饕幌聠?/p>

    來自廣東 回復
  2. 你好,原型文件的度盤都失效了。。。。。??梢灾匦律蟼饕幌聠?/p>

    來自上海 回復
  3. 這原型不只是略吊。簡直吊炸天啊 ??

    來自上海 回復
  4. ?

    來自荷蘭 回復