iT邦幫忙

鐵人檔案

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

關於你關於我關於phaser 系列

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

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

Day1 前言

這是一篇有感而發的長篇大論,可以等明天正式進入主題再來看啦 先說結論:希望 30 天可以做出一些經典的小遊戲並更瞭解怎麽做遊戲 對我來說,夢想是驅動我往前的動力...

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

Day2 我選擇了 phaser 3

這邊就要先說,講到做遊戲,不管是 2D 還是 3D 大家第一個想到的應該是 Unity,不管是資源、成熟度都有一定的程度 但是 但是 但是 先說這邊會扯比較遠,...

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

Day3 第一個遊戲: ~ 建立

現在我們來做一個遊戲吧如果有名詞上或是有問題的地方都可以討論這一個範例是用官網範例(內文有一個 Download this zip file )來練習,可以下載...

2018-10-18 ‧ 由 kai 分享
DAY 4

Day4 第一個遊戲:~場景佈置完成

接下來我們要先載入靜態資源檔,將檔案初始化在我們的頁面上,並透過規則制定遊戲的方式,所以我們一步一步來 載入資源並渲染 //載入圖片,有兩個參數 //第一個...

2018-10-19 ‧ 由 kai 分享
DAY 5

Day5 第一個遊戲:~加入主角

加入我們的主角而這裡可以分成三個部分看先一樣在物理裡面加入新的物件,但這次用的是 sprite ,代表此物件是動態的,而這邊加入了一些物理特性: setBoun...

2018-10-20 ‧ 由 kai 分享
DAY 6

Day 6 第一個遊戲:完成遊戲啦

接下來加入我們的星星,加入步驟爲: create 出星星物件 -> 爲星星加上相對的物理特性(相對於地板與相對於主角) //create() //設定星星...

2018-10-21 ‧ 由 kai 分享
DAY 7

Day7 phaser的滑鼠監聽

今天來講講滑鼠的監聽事件,在 phaser3 中,要讓目標物被監聽的話,要先 setInteractive,並用串聯的方式掛上監聽事件(有點類似用 js 掛監聽...

2018-10-22 ‧ 由 kai 分享
DAY 8

Day 8 關於背景

phaser3 有幾種建立背景的方式,而下面是我有用過的: 整張圖片當背景 var sky var ground class backgroundScene e...

2018-10-23 ‧ 由 kai 分享
DAY 9

Day 9 關於scene

我們的遊戲都是有狀態的來一個簡單的遊戲流程:從這邊我們有幾個狀態:載入、開始、進行、(是否繼續)、結束每個狀態會有每個狀態要渲染的畫面(一個遊戲可能會有的元素)...

2018-10-24 ‧ 由 kai 分享
DAY 10

Day 10 關於 webpack + phaser (前傳)

前言... 因爲開始找到了一些範例(之後會跟大家介紹),並自己實作後發現很好玩,很有野心的想要開始加東加西,發現怎麽這個程式的擴增性這麼受到限制,而且程式碼還越...

2018-10-25 ‧ 由 kai 分享