
舞臺是固定大小的,所展示出的一面,世界是大小可設置的,甚至無限大的。





攝像機大小默認是世界大小,如果設置世界大小很大 攝像機就可以移動啦,
例子:
~~~
var play = function(game){
this.init=function(){}
this.preload = function(){
var fj = game.add.image(0,0,'fj')
fj.anchor = {x:0.5,y:0.5} //設置圖片錨點
}
this.create = function(){
console.log('play')
game.world.setBounds(0,0,2000,600)//設置是世界大小 參數 左上角xy坐標,寬高
}
this.update = function(){
var keys = game.input.keyboard.createCursorKeys()
if(keys.right.isDown){game.camera.x += 1}
else if(keys.left.isDown){game.camera.x -= 1}
else if(keys.down.isDown){game.camera.y += 1}
else if(keys.up.isDown){game.camera.y -= 1}
}
this.render = function(){}
}
~~~
相機即可跟著鍵盤移動而移動啦
相機聚焦到某個物體
~~~
var play = function(game){
this.init=function(){}
this.preload = function(){
var fj = game.add.image(0,0,'fj')
}
this.create = function(){
console.log('play')
game.world.setBounds(0,0,2000,600)//設置是世界大小 參數 左上角xy坐標,寬高
pig = game.add.image(200,300,'pig')
pig.anchor.set(0.5,0.5)
game.camera.focusOn(pig) //相機聚焦到小豬上
}
this.update = function(){
var keys = game.input.keyboard.createCursorKeys()
if(keys.right.isDown){game.camera.x += 1}
else if(keys.left.isDown){game.camera.x -= 1}
else if(keys.down.isDown){game.camera.y += 1}
else if(keys.up.isDown){game.camera.y -= 1}
}
this.render = function(){}
}
~~~

讓相機跟隨小豬移動`
~~~
game.camera.follow(pig)
~~~`
- 以專業工程師的標準要求自己
- JS
- 函數的this
- 函數的argument
- 函數的apply、bind、call方法
- 創建對象
- 構造函數創建對象
- 原型結合構造函數創建對象
- 原型
- 繼承
- 閉包
- 正則表達式
- Ajax
- 設計模式
- ES6
- es6的模塊化
- 定義變量的新方式
- 函數擴展
- 數組擴展
- 性能與工程化
- 關于http與緩存
- 重排(reflow、layout)與重繪
- 頁面性能
- gulp
- webpack
- 一些項目回顧總結
- 移動端&微信H5游戲
- 微信小程序
- Vue.js
- 隨手記錄
- 如何通過前端技能獲取2018世界杯門票
- jsonp
- es6 javascript對象方法Object.assign()
- 一份不錯的基礎面試題
- vscode常用插件
- koroFileHeader
- 構建自己的Js工具庫
- H5 game
- Phaser從入坑到放棄再入坑
- 1.游戲的創建
- 2.資源的加載
- 3.phaser中的舞臺,世界和攝像機
- 4.游戲縮放控制,移動端的適配
- 5.phaser中的顯示對象
- 1.概述
- 2.phaser中的圖片,圖形,和按鈕
- 3.phaser中的精靈
- 4.文字
- 5.組
- 6.phaser中的動畫
- 7.粒子和瓦片地圖
- 8.瓦片地圖
- lodash
- ES5 to ESNext?—?here’s every feature added to JavaScript since 2015
- 防抖(debounce) 和 節流(throttling)