摘要:一首先當然得有至少有二個場景二從場景傳值到場景二種方法通過事件從通過時傳值到時有個需要特別注的事項就是,得把的設為否則因為還未激活,是監聽不到事件的通過場景啟動具體詳見代碼在整個工程中只會執行一次每次調用場景會執行一次從事件傳
一、首先當然得有至少有二個場景sceneA.js,sceneB.js
二、從場景A傳值到場景B二種方法
1)通過事件this.events.emit("event key",{objKey:objValue});
從sceneA通過 ths.events.emit時傳值到sceneB時有個需要特別注的事項就是,得把sceneB的 active設為 ture,否則因為 sceneB還未激活,是監聽不到 events.on事件的!!!
2)通過場景啟動this.scene.start("gameB key",{objKey:objValue});
具體詳見代碼:
HTML
iFIERO Games Tutorial ©Copyrigths By www.iFIERO.com
sceneA.js
"use strict"; var SceneA = new Phaser.Class({ Extends: Phaser.Scene, // 在整個工程中只會執行一次 initialize: function BootScene() { Phaser.Scene.call(this, { key: "sceneA", active: false // listening resize event; }); }, // 每次調用場景SceneA會執行一次; init: function () { }, preload:function(){ }, create:function(){ // 1. 從SCENEA emit gameCountDown事件,傳送 {countDown:10} 對象到場景B sceneB this.events.emit("gameCountDown",{countDown:10}); //* 事件KEY=>gameCountDown // 2.start方法傳送 this.scene.start("sceneB",{countDown:10}) //* 場景KEY=> sceneB }, });
sceneB.js
"use strict"; var SceneB = new Phaser.Class({ Extends: Phaser.Scene, initialize: function BootScene() { Phaser.Scene.call(this, { key: "sceneB", active: true // listening resize event; }); }, init: function (data) { //方法1. 引入sceneA 在初始化的時候就可以獲得場景Scene傳遞的值; this.sceneA = this.scene.get("sceneA"); // sceneA"s key console.log("get data from sceneA:",data.countDown); }, preload:function(){ }, create:function(){ // 方法2.監聽scene的事件 gameCountDown this.sceneA.events.on("gameCountDown",function(data){ console.log(data.countDown); }); }, });
gameconfig.js
var game; //* setDepth for every object; var gameConfig = { depth:{ player:1, } } // once the window loads... window.onload = function () { // 接收 websocket; // config of the game; var config = { type: Phaser.AUTO, parent: "game", width: 640, // don"t window.innerWidth height: 512, physics: { default: "arcade", arcade: { gravity: { y: 0 }, debug: false, } }, //*** scenes used by the game // scene: [BootScene,PlayGameScene,UIScene] } game = new Phaser.Game(config); game.scene.add("sceneA", SceneA); //*** key,class */ game.scene.add("sceneB", SceneB); window.focus(); resize(); window.addEventListener("resize", resize, false); } function resize() { var canvas = document.querySelector("canvas"); var windowWidth = window.innerWidth; var windowHeight = window.innerHeight; var windowRatio = windowWidth / windowHeight; var gameRatio = game.config.width / game.config.height; if (windowRatio < gameRatio) { canvas.style.width = windowWidth + "px"; canvas.style.height = (windowWidth / gameRatio) + "px"; } else { canvas.style.width = (windowHeight * gameRatio) + "px"; canvas.style.height = windowHeight + "px"; } }
結語: 用Phaserjs3 JavaScript框架 來開發HTML網頁游戲,雖不復雜,但有道是『紙上得來終覺淺,絕知此事要躬行』,代碼還是得親自多碼才行噢!
更多游戲教學:http://www.iFIERO.com -- 為游戲開發深感自豪
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/53222.html
摘要:一首先當然得有至少有二個場景二從場景傳值到場景二種方法通過事件從通過時傳值到時有個需要特別注的事項就是,得把的設為否則因為還未激活,是監聽不到事件的通過場景啟動具體詳見代碼在整個工程中只會執行一次每次調用場景會執行一次從事件傳 showImg(https://segmentfault.com/img/remote/1460000016953682); 一、首先當然得有至少有二個場景sc...
摘要:前言作為一款流行的游戲動畫框架受到很多開發者的青睞最近筆者在逛意大利開發者論壇的時候發現了這款小游戲所以就照著說明做了一下在這里記錄下來開發準備插件腳本飛刀和靶子的圖像或者這個項目里面有的腳本和需要的圖像文件開始制作搭建基本的項目創建一個 前言 phaser作為一款流行的游戲/動畫框架,受到很多web開發者的青睞,最近筆者在逛意大利開發者:emanueleferonato論壇的時候發現...
摘要:自定義自定義完整代碼更多游戲教學為游戲開發深感自豪 showImg(https://segmentfault.com/img/remote/1460000017262663); EC6 自定義class class Brain extends Phaser.GameObjects.Sprite { constructor (scene, x, y) { ...
摘要:自定義自定義完整代碼更多游戲教學為游戲開發深感自豪 showImg(https://segmentfault.com/img/remote/1460000017262663); EC6 自定義class class Brain extends Phaser.GameObjects.Sprite { constructor (scene, x, y) { ...
閱讀 3512·2021-11-15 11:38
閱讀 825·2021-11-08 13:27
閱讀 2235·2021-07-29 14:50
閱讀 2970·2019-08-29 13:06
閱讀 838·2019-08-29 11:22
閱讀 2408·2019-08-29 11:04
閱讀 3499·2019-08-28 18:23
閱讀 890·2019-08-26 13:46