CocosCreator 入門チュートリアル: TS で初めてのゲームを作る

// - [英語] http://www.cocos2d-x.org/docs/editors_and_tools/creator-chapters/scripting/typescript/index.html
// 属性を学習:
// - [中国語] http://www.cocos.com/docs/creator/scripting/reference/attributes.html
// - [英語] http://www.cocos2d-x.org/docs/editors_and_tools/creator-chapters/scripting/reference/attributes/index.html
// ライフサイクルコールバックを学ぶ:
// - [中国語] http://www.cocos.com/docs/creator/scripting/life-cycle-callbacks.html
// - [英語] http://www.cocos2d-x.org/docs/editors_and_tools/creator-chapters/scripting/life-cycle-callbacks/index.html

const {ccclass、プロパティ} = cc._decorator;

@ccクラス
デフォルトクラス NewClass をエクスポートし、cc.Component を拡張します。

    @property(cc.ラベル)
    ラベル: cc.Label = null;

    @財産
    テキスト: 文字列 = 'hello';

    // ライフサイクルコールバック:

    // onLoad() {},

    始める （） {

    },

    // 更新 (dt) {},
}

const {ccclass、プロパティ} = cc._decorator;

@ccクラス
エクスポートクラス NewClass は cc.Component を拡張します {

}

定数 LEVEL = cc.Enum({EASY:1,HARD:2});

@ccクラス
エクスポートクラスGameはcc.Componentを拡張します。
    // 整数 @property (cc.Integer)
    intVar: 数値 = 0;
    // 浮動小数点型 @property(cc.Float)
    浮動小数点数: 数値 = 0;
    // ブール型 @property (cc.Boolean)
    boolVar: ブール値 = false;
    // ノード@プロパティ(cc.Node)
    ノード変数: cc.Node = null;
    // ノード配列 @property([cc.Node])
    ノードArrVar: 配列<cc.Node> = [];
    // ラベル
    @property(cc.ラベル)
    ラベル変数: cc.Label = null;
    // プレハブ @property(cc.Prefab)
    プレファブ変数: cc.Prefab = null;
    //ポイント @property(cc.Vec2)
    vec2Var: cc.Vec2 = cc.v2();
    // カスタム ノード @property(Player)
    プレイヤー変数:プレイヤー = null;
    // ここでポイントとなるカスタム列挙/**
     * グローバル変数* const LEVEL = cc.Enum({EASY:1,HARD:2});
     */ 
    @財産（{
        タイプ:レベル
    })
    enumVa = レベル.EASY;
}

「./Player」から { Player } をインポートします。

const { プロパティ、ccclass } = cc._decorator;

@ccクラス
エクスポートクラスGameはcc.Componentを拡張します。
    // このプロパティはスターのプレハブリソースを参照します @property(cc.Prefab)
    プライベート starPrefab: cc.Prefab = null;
    // 星が生成されてから消えるまでのランダムな時間範囲 @property(cc.Integer)
    プライベートmaxStarDuration = 0;
    @property(cc.Integer)
    プライベート minStarDuration = 0
    // 星生成の高さを決定するために使用される地上ノード @property(cc.Node)
    プライベート groundNode: cc.Node = null;
    // プレイヤーノード。主人公の跳ね返りの高さを取得し、主人公のアクションスイッチを制御するために使用されます @property(cc.Node)
    パブリック playerNode: cc.Node = null;
    // スコアラベルへの参照 @property(cc.Label)
    プライベートスコアラベル: cc.Label = null;
    // スコアリング効果音リソース @property(cc.AudioClip)
    プライベートスコアオーディオ: cc.AudioClip = null;

    // 地上ノードの Y 軸座標 private groundY: number;
    //タイマーpublic timer: number;
    // 星の存在期間 public starDuration: number;
    // 現在のスコア private score: number;

    保護されたonLoad() {
        // 地面の Y 軸座標を取得します。this.groundY = this.groundNode.y + this.groundNode.height / 2;
        // タイマーを初期化します this.timer = 0;
        this.starDuration = 0;
        // 新しい星を生成します this.spawnNewStar();
        // スコアリングを初期化します this.score = 0;
    }

    // 新しい星を生成する public spawnNewStar() {
        // 指定されたテンプレートを使用してシーン内に新しいノードを生成します。let newStar = cc.instantiate(this.starPrefab);
        // 新しく追加されたノードを Canvas ノードに追加します。this.node.addChild(newStar);
        // 星のランダムな位置を設定します newStar.setPosition(this.getNewStarPosition());
        // Game コンポーネントのインスタンスをスター コンポーネントに渡します newStar.getComponent('Star').init(this);
        // タイマーをリセット this.starDuration = this.minStarDuration + cc.random0To1() * (this.maxStarDuration - this.minStarDuration);
        this.timer = 0;
    }

    // 新しい星の位置 public getNewStarPosition() {
        randX = 0 とします。
        // 地面の位置と主人公のジャンプの高さに基づいて、星の y 座標をランダムに取得します。let randY = this.groundY + cc.random0To1() * this.playerNode.getComponent('Player').jumpHeight + 50;
        // 画面の幅に基づいて星の x 座標をランダムに取得します。let maxX = this.node.width / 2;
        randX = cc.randomMinus1To1() * maxX;
        // 星の座標を返します return cc.p(randX, randY);
    }

    // フレームごとに呼び出される
    保護された更新(dt: 数値) {
        // フレームごとにタイマーを更新します。制限を超えて新しい星が生成されない場合は、ゲーム失敗ロジックが呼び出されます。if (this.timer > this.starDuration) {
            ゲームオーバー();
            戻る;
        }
        this.timer += dt;
    }

    // スコア public gainScore() {
        this.スコア += 1;
        // scoreDisplay Label のテキストを更新します。this.scoreLabel.string = 'Score: ' + this.score.toString();
        // スコアのサウンド効果を再生します // as any を追加しないとエラーが発生します。信じられない場合は、cc.audioEngine.play(this.scoreAudio as any, false, 1); を試してください。
    }

    // ググ
    プライベートgameOver() {
        this.playerNode.stopAllActions(); //プレイヤーノードのジャンプアクションを停止します cc.director.loadScene('game');
    }

}

const { ccclass, property } = cc._decorator;

@ccクラス
エクスポートクラス Player は cc.Component を拡張します {
    // 主人公のジャンプの高さ @property(cc.Integer)
    プライベートジャンプ高さ: 数値 = 0;
    // 主人公のジャンプの持続時間 @property(cc.Integer)
    プライベートジャンプ期間: 数値 = 0;
    // 最大移動速度 @property(cc.Integer)
    プライベートmaxMoveSpeed: 数値 = 0;
    // acceleration@property(cc.Integer)
    プライベートアクセル: 数値 = 0;
    // ジャンプ効果音リソース @property(cc.AudioClip)
    プライベートjumpAudio: cc.AudioClip = null;

    プライベートxSpeed: 数値 = 0;
    プライベート accLeft: ブール値 = false;
    プライベート accRight: ブール値 = false;
    プライベートジャンプアクション: cc.Action = null;

    プライベートsetJumpAction() {
        // 上にジャンプ let jumpUp = cc.moveBy(this.jumpDuration, cc.p(0, this.jumpHeight)).easing(cc.easeCubicActionOut());
        // 落下 let jumpDown = cc.moveBy(this.jumpDuration, cc.p(0, -this.jumpHeight)).easing(cc.easeCubicActionIn());
        // アクションが終了したときに定義した他のメソッドを呼び出すためのコールバック関数を追加します。let callback = cc.callFunc(this.playJumpSound, this);
        // 継続的に繰り返し、着地アクションが完了するたびにコールバックを呼び出してサウンドを再生します。 return cc.repeatForever(cc.sequence(jumpUp, jumpDown, callback));
    }

    プライベートplayJumpSound() {
        //サウンド エンジンを呼び出してサウンドを再生します cc.audioEngine.play(this.jumpAudio as any, false, 1);
    }

    プライベートaddEventListeners() {
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN、this.onKeyDown、this);
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP、this.onKeyUp、this);
        cc.find("Canvas").on(cc.Node.EventType.TOUCH_START、this.onScreenTouchStart、this);
        cc.find("Canvas").on(cc.Node.EventType.TOUCH_CANCEL、this.onScreenTouchEnd、this);
        cc.find("Canvas").on(cc.Node.EventType.TOUCH_END, this.onScreenTouchEnd,this);
    }

    プライベートmoveLeft() {
        this.accLeft = true;
        this.accRight は false です。
    }

    プライベートmoveRight() {
        this.accLeft = false;
        this.accRight を true に設定します。
    }

    プライベートstopMove() {
        this.accLeft = false;
        this.accRight は false です。
    }

    プライベート onScreenTouchStart(イベント: cc.Event.EventTouch) {
        （event.getLocationX() > cc.winSize.width/2）の場合{
            これを右に動かします。
        } それ以外 {
            これを左へ移動します。
        }
    }

    プライベートonScreenTouchEnd() {
        this.stopMove();
    }

    プライベート onKeyDown(イベント: cc.Event.EventKeyboard) {
        switch ((イベントをanyとして).keyCode) {
            cc.KEY.aの場合:
            ケースcc.KEY.left:
                これを左へ移動します。
                壊す;
            cc.KEY.dの場合:
            ケースcc.KEY.right:
                これを右に動かします。
                壊す;
        }
    }

    プライベート onKeyUp(イベント: cc.Event.EventKeyboard) {
        switch ((イベントをanyとして).keyCode) {
            cc.KEY.aの場合:
            ケースcc.KEY.left:
                this.stopMove();
                壊す;
            cc.KEY.dの場合:
            ケースcc.KEY.right:
                this.stopMove();
                壊す;
        }
    }

    // 初期化にこれを使用
    保護されたonLoad() {
        // ジャンプアクションを初期化します this.jumpAction = this.setJumpAction();
        this.node.runAction(this.jumpAction);

        // 加速方向スイッチ this.accLeft = false;
        this.accRight は false です。
        // 主人公の現在の水平速度 this.xSpeed ​​= 0;

        // 入力リスニングを初期化します this.addEventListeners();
    }

    // フレームごとに呼び出される
    保護された更新(dt: 数値) {
        // 現在の加速方向に応じてフレームごとに速度を更新する if (this.accLeft) {
            this.xSpeed ​​-= this.accel * dt;
        } それ以外の場合は (this.accRight) {
            this.xSpeed + = this.accel * dt;
        }
        // 主人公の速度が最大値を超えないように制限します if (Math.abs(this.xSpeed) > this.maxMoveSpeed) {
            // 速度が制限に達した場合は、現在の方向で最大速度を使用します
            this.xSpeed ​​= this.maxMoveSpeed ​​* this.xSpeed ​​/ Math.abs(this.xSpeed);
        }

        // 現在の速度に応じて主人公の位置を更新します this.node.x += this.xSpeed ​​* dt;
        (this.node.x <= -this.node.parent.width / 2) の場合 {
            this.node.x = this.node.parent.width / 2;
        }
        （this.node.x > this.node.parent.width / 2）の場合{
            this.node.x = -this.node.parent.width / 2;
        }
    }

}

「./Game」から Game をインポートします。

const {ccclass,property} = cc._decorator;

@ccクラス
エクスポートクラス Star は cc.Component を拡張します {

    // 星と主人公の間の距離がこの値に達すると、コレクションが完了します @property(cc.Integer)
    プライベートpickRadius: 数値 = 0;
    プライベートゲーム:Game = null;

    パブリック init(ゲーム:ゲーム) {
        this.game = ゲーム;
    }

    プレイヤーの距離を取得する() {
        // プレイヤーノードの位置に基づいて距離を決定します。let playerPos = this.game.playerNode.getPosition();
        // 2 つのポイントの位置に基づいて 2 つのポイント間の距離を計算します。let dist = cc.pDistance(this.node.position, playerPos);
        dist を返します。
    }

    選択された() {
        // 星が収集されると、ゲーム スクリプト内のインターフェイスを呼び出して新しい星を生成します。this.game.spawnNewStar();
        //Game スクリプトのスコアリング メソッドを呼び出します。this.game.gainScore();
        // 次に、現在のスターノードを破棄します。this.node.destroy();
    }

    // フレームごとに呼び出される
    更新(dt:数値) {
        // 各フレームは、プレイヤーとメインキャラクター間の距離がコレクション距離より短いかどうかを判断します。if (this.getPlayerDistance() < this.pickRadius) {
            //コレクション動作を呼び出します this.onPicked();
            戻る;
        }
        // ゲーム スクリプトのタイマーに従って星の透明度を更新します。let opacityRatio = 1 - this.game.timer/this.game.starDuration;
        minOpacity を 50 にします。
        this.node.opacity = minOpacity + Math.floor(opacityRatio * (255 - minOpacity));
    }

}