微信小遊戲-CocosCreator 基礎（二十二）
地圖格式：tmx 地圖場景設定碰撞： 一個節點一個剛體多個碰撞器
新建專案模板修改？疑問 打包圖集破解的資源？疑問
官方物理引擎案例 ： 1: 準備好tiled地圖; 2: 為tiled地圖編輯好物理碰撞器; 3: 放出角色,為角色編輯好物理碰撞器; 4: 監聽鍵盤訊息: cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.on_key_down.bind(this), this); cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.on_key_up.bind(this), this); 5: 設定角色的水平和豎直速度; 豎直600,水平400 6: 設定cc.Camera元件,設定Camera跟誰玩家;
cc.Camera元件 ： 1: 配置哪些物體受Camera元件影響; Targets: 受Camera影響的物體的集合; 2: 配置Camera跟隨目標: var w_pos = this.target.convertToWorldSpaceAR(cc.p(0, 0)); var pos = this.node.parent.convertToNodeSpaceAR(w_pos);
==================================================== 開啟物理引擎： cc.Class({ extends: cc.Component,
properties: { // foo: { // default: null, // The default value will be used only when the component attaching // to a node for the first time // url: cc.Texture2D, // optional, default is typeof default // serializable: true, // optional, default is true // visible: true, // optional, default is true // displayName: 'Foo', // optional // readonly: false, // optional, default is false // }, // ... is_debug: false, // 是否顯示除錯資訊; // 重力加速度是一個向量, 有方向的,2D, Vec重力加速度的大小; gravity: cc.p(0, -320), // 系統預設的 },
// use this for initialization onLoad: function () { // 遊戲引擎的總控制 // cc.Director, cc.director 區別呢？ // 大寫的cc.Director是一個類, 小寫cc.direcotr全域性的例項 cc.director.getPhysicsManager().enabled = true; // 開啟了物理引擎 // 獨立的形狀，開啟一個除錯區域,遊戲影象的，邏輯區域; // 開始除錯模式: if (this.is_debug) { // 開啟除錯資訊 var Bits = cc.PhysicsManager.DrawBits; // 這個是我們要顯示的型別 cc.director.getPhysicsManager().debugDrawFlags = Bits.e_jointBit | Bits.e_shapeBit; } else { // 關閉除錯資訊 cc.director.getPhysicsManager().debugDrawFlags = 0; } // 重力加速度的配置 cc.director.getPhysicsManager().gravity = this.gravity; },
// called every frame, uncomment this function to activate update callback // update: function (dt) {
// }, });
===================================== 攝像機跟隨的物體：先新增攝像機元件，選擇整體需要檢測的物件 cc.Class({ extends: cc.Component,
properties: { // foo: { // default: null, // The default value will be used only when the component attaching // to a node for the first time // url: cc.Texture2D, // optional, default is typeof default // serializable: true, // optional, default is true // visible: true, // optional, default is true // displayName: 'Foo', // optional // readonly: false, // optional, default is false // }, // ... target: { default: null, type: cc.Node, }, },
// use this for initialization onLoad: function () {
},
// called every frame, uncomment this function to activate update callback update: function (dt) { if (this.target === null) { return; } // target到哪裡, camera跟到哪裡 var wpos = this.target.convertToWorldSpaceAR(cc.p(0, 0));//轉化為世界座標 var pos = this.node.parent.convertToNodeSpaceAR(wpos);//統一以canvas為原點的座標系的錨點座標 // this.node.setPosition(pos); this.node.x = pos.x; }, }); =========================================== 角色的移動： // 鍵盤,水平移動,左右 // 跳躍為空給
cc.Class({ extends: cc.Component,
properties: { body: { type: cc.RigidBody, default: null, }, },
onLoad: function () { // 程式碼獲取 // this.body = this.ndoe.getComponent(cc.RigidBody); // end cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.on_key_down.bind(this), this);//按下 cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.on_key_up.bind(this), this);//按上時
this.input_flag = 0; },
jump: function() { var v = this.body.linearVelocity; v.y = 600; this.body.linearVelocity = v; },
// -1, 1 walk: function(dir) { var v = this.body.linearVelocity; v.x = 300 * dir; this.body.linearVelocity = v; this.node.scaleX = dir; },
on_key_down: function(e) { switch(e.keyCode) { case cc.KEY.left: this.input_flag = -1; break; case cc.KEY.right: this.input_flag = 1; break;
case cc.KEY.space: this.jump(); break; } },
on_key_up: function(e) { switch(e.keyCode) { case cc.KEY.left: this.input_flag = 0; break; case cc.KEY.right: this.input_flag = 0; break; case cc.KEY.space: break; } },
update: function (dt) { if (this.input_flag !== 0) { this.walk(this.input_flag); } }, });