iT邦幫忙

鐵人檔案

2019 iT 邦幫忙鐵人賽
回列表
Modern Web

關於你關於我關於phaser 系列

透過30天的文章與練習,帶大家認識phaser,一個canvas做2D遊戲的框架,讓大家隨心所欲就能信手拈來一個小遊戲

鐵人鍊成 | 共 30 篇文章 | 31 人訂閱 訂閱系列文 RSS系列文 團隊好想工作室第二屆鐵人賽
DAY 11

Day 11 關於 webpack + phaser (後記)

接下來就是跟大家說我遇到了那些問題,與怎麽解決啦 在最後放上我的 github 的連結,可以自己 clone 下來玩看看(因爲自己也還沒做到太多的測試,包含 b...

2018-10-26 ‧ 由 kai 分享
DAY 12

Day 12 webpack + phaser (番外)

你以爲結束了嗎?當然還沒 在自己研究外如何將 webpack 與 phaser 結合後,很開心的四處炫耀,結果隔天開始讀官網介紹時, 幹! 怎麽官方已經有 we...

2018-10-27 ‧ 由 kai 分享
DAY 13

Day 13 塔防遊戲 ~ 畫出路線

接下來幾天會製作一款塔防遊戲,會先將程式寫在一個檔案,之後再做拆分,並開始添加新功能 爲什麼會是這個順序呢? 因爲找到一篇塔防的教學,學完覺得有很多可以擴充的地...

2018-10-28 ‧ 由 kai 分享
DAY 14

Day 14 塔防遊戲 ~ 敵人出現

再來會稍微複雜一點,我們要創造一個會移動的敵人 創造敵人 先建立一個空的敵人類別 var Enemy = new Phaser.Class({...

2018-10-29 ‧ 由 kai 分享
DAY 15

Day 15 塔防遊戲 ~ 建立炮塔

接下來我們要加入我們的炮塔,這邊用的方式比較簡單,使用棋盤式的排列方式,將地圖畫成一格一格的,並加入一個二維陣列,然後會將滑鼠點下去的位置轉換成一個數列,並且去...

2018-10-30 ‧ 由 kai 分享
DAY 16

Day 16 塔防遊戲 ~ 發射子彈

我們要加入子彈,並且讓炮塔可以偵測敵人的位置是否進入自己的半徑範圍,有的話可以發射子彈,當子彈射中敵人就會有碰撞事件,而敵人會扣血,扣到血量爲零就消失 創建我們...

2018-10-31 ‧ 由 kai 分享
DAY 17

Day 17 塔防遊戲 ~ 完成啦

最後加入碰撞事件與扣血機制 在一開始的 config 加入 var config = { //... physics: { de...

2018-11-01 ‧ 由 kai 分享
DAY 18

Day 18 塔防 module 架構篇

再來就是如何將我們的塔防模組化了,爲什麼要模組化呢?你可以嘗試看看在原本的檔案要修改一些微小的東西(不管是想要改變敵人的血量或是改變攻擊的速度),你會發現,你要...

2018-11-02 ‧ 由 kai 分享
DAY 19

Day 19 塔防 module 實作篇

我對於模組化的東西的方式是希望,可以在主程式去 new 出所有東西,並且可以隨時修改他的參數,所以我的 index.js 會import 希望import 所有...

2018-11-03 ‧ 由 kai 分享
DAY 20

Day 20 塔防 module 修改篇(或許該說痛苦篇?)

當然,模組化完是希望可以按照自己的期望去新增很多東西,但是事與願違,這邊告訴大家爲什麼 從我上次的給的 github 可以看到一個 Money 的檔案,這就是我...

2018-11-04 ‧ 由 kai 分享