phaser小遊戲框架學習(二)

2022-07-23 14:45:28 字數 1469 閱讀 4241

今天繼續學習phaser.js。上週寫的學習教程主要內容是建立遊戲場景,遊戲中的顯示物件,按鈕物件的使用以及如何在不同螢幕大小中完美適配。這篇部落格以介紹遊戲榜單的渲染更新為主。

這個學習過程是以乙個類似於頭腦風暴的遊戲為例項,來學習phaser的框架,會有很多api講不到,可自己去查,去學習。

由於考慮到後面的需求,所以現在將檔案的檔名改了,demo01.js改為了load.js(用於載入和精靈圖),增加了game.js(公共的函式以及遊戲場景的建立)

建立文字文字

這裡可以看一下建立文字物件的時候需要的引數,有五個引數,第乙個一般是遊戲物件,一般指的是game物件。x代表文字在x方向上的位置,y代表文字在y方向的位置。text--想要渲染的文字內容,style-文字樣式

更改文字內容

在phaser.js中有乙個settext的方法,但是,也可以直接給這個文字物件的text屬性賦值。建議輸出一下建立的文字物件的屬性。這樣,能更熟悉的運用這個文字物件。

具體使用可以看一下**;這裡我把billboard的**貼出來,具體的呼叫可以在github中看.

/*

如何將渲染遊戲中的文字

*///

需求:榜單排名需要每隔一段事件就要更新,這裡我們就在update或者render函式中改變排名內容;

//update和render函式是每秒就會調一次,但它並不會影響整個遊戲的記憶體

function

billboard()

this.preload = function

())

/*var listbg = game.add.image(24*bl,120*bl,'score-list');

listbg.width = 594 *bl;

listbg.height = 879 *bl;

*///

這個函式是addimage未封裝的內容。

this

.loadtext()

}this.update = function

()else}}

});},2000)

}this.addtext = function

(x,i,text,fontsize,color))

//有四個引數,this.add.text(x,y,text,style)//這四個引數分別代表了文字的x方向的位置,y方向的位置,當前的文字內容,樣式物件;渲染的字型基本都是預設加粗的字型。

return

text

}this.loadtext = function

() },

error:

function

(err)

});}

}

Phaser 桌面和手機遊戲HTML5框架

phaser是乙個流行的2d開源遊戲框架,可以用來開發桌面或手機瀏覽器html5遊戲,適合側視或頂視風格 phaser同時支援canvas和webgl渲染引擎,預置了完備的精靈動畫 輸入 管理 瓦片地圖 補間動畫 資源載入器 物理系統 粒子系統等特性,幾乎能夠 滿足你開發乙個2d遊戲的任何需求 ph...

小遊戲學習日記

最近結合小遊戲開發來進行android學習,選擇的小遊戲是連連看。requestwindowfeature 1.這個方法啟用視窗的擴充套件屬性,引數是windows的一些列舉常量。windowmanager windowmanager getwindowmanager 2.該物件可以可以忽略acti...

python學習 小遊戲

基於python3.4 while迴圈 1 usr bin python32 coding utf 8 34 import random 5import sys6 importos7 8 lucky num int random.randint 0,9 9 guess count 0 10 os.s...