本次引擎2.0.5

編輯工具VSCode

目標：

第二部分，過橋與得分。

接著上一節：

我們實現了木板的變長與下落。

現在我們實現一個牛逼的平臺，怎麼說它牛逼呢？我準備全程就用它一個來完成所有功能。

看KUOKUO怎麼實現。console.log(滑稽)

首先，我們複製個ground然後改名字為move_ground,然後拖到中間。

好了，然後我們在mian腳本里宣告它：

接下來，我們在onLoad中提前隨機個位置和寬度：

位置在0到150之間；寬度在100到200之間吧（你們看心情隨機）

我們寫個方法：

然後在onLoad開始時呼叫一次：

好了,隨機的平臺弄好了，我們在結束觸控時進行長度判斷吧：

就是先計算一下可以踩住橋的一個範圍，然後看看木板的height在不在範圍內：

看註釋(第二個式子的註釋應該是右邊界)：

這樣就可以判斷遊戲狀態了。

接下來我們寫一下判斷成功後的動畫（判斷失敗那裡我列印了Gameover，小夥伴們去自定義吧，嘿嘿）

然後，成功後小人走過去，木板長度歸零，角度回到0，

記得宣告個zhujue節點；把主角拖過去：

在長度判斷成功後這樣：

小人走過去之後把板子復位，然後平臺跟小人一起回去，但是板子回去的多，直至出螢幕 

怎麼樣，註釋全吧！！！

嘻嘻！

看看效果：

怎麼樣？

來，加個分數顯示吧！

怎麼樣，不難吧。

好了，由於這個小遊戲就用到了一個指令碼（其實不是好習慣，還有我的程式碼並不是最優的，主要是思維要到位！）

我就不打包上傳網盤啦！給出程式碼：

main.js

cc.Class({
    extends: cc.Component,

    properties: {
        // 木板節點
        blank : cc.Node,
        // 變長標誌
        long_flag : 0,
        // 移動平臺
        move_ground: cc.Node,
        // 主角
        zhujue : cc.Node,
        // 分數顯示
        fen_label : cc.Label,
        // 分數
        fen : 0
    },

    onLoad () {
        this.fen_label.string = this.fen + '';
        // 初始化時木板為0
        this.blank.height = 0;
        // 隨機平臺屬性
        this.randomGround();
        // 觸控開始
        this.node.on('touchstart',function() {
            this.long_flag = 1;
        },this);
        // 觸控結束
        this.node.on('touchend',function() {
            this.long_flag = 0;
            // 計算可通過平臺的範圍
            // 移動平臺的 x 座標減去木板的 x 座標再減去寬度的一半為左邊界
            var left = this.move_ground.x - this.blank.x - (this.move_ground.width / 2);
            // 移動平臺的 x 座標減去木板的 x 座標再加上寬度的一半為左邊界
            var right = this.move_ground.x - this.blank.x + (this.move_ground.width / 2);
            // 如果在這個範圍內
            if (this.blank.height >= left && this.blank.height <= right) {
                // 小人走過去動作
                // 注意 y 軸座標是zhujue的
                var act_go = cc.callFunc(function() {
                    this.zhujue.runAction(cc.moveTo(1,this.move_ground.x,this.zhujue.y));
                    // 加分
                    this.fen ++;
                    this.fen_label.string = this.fen + '';
                },this);
                
                // 開始旋轉90度後小人走過去
                this.blank.runAction(cc.sequence(cc.rotateBy(1.5,90),act_go));

                // 1.1秒 + 1.5秒 後小人跟平臺一起往回走
                this.scheduleOnce(function() {
                    // 板子復位
                    this.blank.height = 0;
                    this.blank.rotation = 0;
                    // 注意各自 y 座標
                    this.zhujue.runAction(cc.moveTo(1,-220,this.zhujue.y));
                    this.move_ground.runAction(cc.moveTo(1.5,-330,this.move_ground.y));
                },2.6);

                // 平臺出屏幕後把 y 減小，然後隨機位置浮現
                this.scheduleOnce(function() {
                    this.move_ground.y = -750;
                    this.randomGround();
                    this.move_ground.runAction(cc.moveBy(1,0,500));
                },2.6 + 1.5);
            }
            else {
                console.log('Gameover');
            }
        },this);
    },

    // 隨機移動平臺屬性
    randomGround () {
        this.move_ground.x = 0;
        // 隨機x座標在 0 - 150
        this.move_ground.x += 150 * Math.random();
        // 隨機寬度 100 - 200；
        this.move_ground.width = 100 + 100 *Math.random();
    },

    update (dt) {
        if (this.long_flag == 0) {
            return;
        }
        else {
            this.blank.height += 100 * dt;
        }
    }

});
 

Get ！~~~

加我QQ群：（部落格裡面的專案，群檔案裡都有哦）

706176551

我們一起學習！

O(∩_∩)O~~