CocosCreator でカメラトラッキングに cc.follow を使用する方法

Cocos Creator バージョン: 2.3.4

デモのダウンロード: https://files-cdn.cnblogs.com/files/gamedaybyday/cocos2.3.4_ccfollow.7z

まず、cocoscreator に付属するフォロー コード cc.follow を使用しましょう。

CC.Followの使用

1. マップアダプタコンテナのleftNodeを設定する

これは水平パルクールゲームだとしましょう。マップのサイズは 1500x1500 なので、leftNode の高さと幅は 1500x1500 になり、ウィジェットは左下に配置されます。

2. マップコンテナマップを設定する

マップコンテナも 1500x1500 です。leftNode との違いは、アダプタコンポーネントウィジェットがないことです。ウィジェットを使用すると、マップを移動することはできません。このため、画面に適応するために leftNode の追加レイヤーが使用されます。

マップには役割があります。 (通常のcc.Buttonボタン)

地図の端を識別するために、地図の周囲に赤いボタンがあります。

Follow.ts コンポーネントをマップ コンテナーに追加し、ターゲット ロールを Role に設定します。ロールはボタン cc.Button であり、ここでは移動ロールとして扱います。

Follow.ts のコードは次のとおりです。

const {ccclass、プロパティ} = cc._decorator;
 
@ccクラス
デフォルトクラスFollowをエクスポートし、cc.Componentを拡張します。
 
    @property(cc.Node)
    ターゲット:cc.Node = null;
 
    始める （） {
        var follow = cc.follow(this.target, cc.rect(0,0, 1500,1500));
        this.node.runAction(フォロー);
    }
}

3. 仮想ジョイスティックでキャラクターの動きをコントロール

仮想ジョイスティックリファレンス: https://www.cnblogs.com/gamedaybyday/p/13061387.html

知らなくても問題ありません。他の方法でキャラクターの動きを制御し、キャラクターの x と y を変更できれば問題ありません。

4. 実際の実証効果

キャラクターが移動すると、「カメラ」が自動的にキャラクターを追い、赤いボタンが配置されている境界を超えない 1500 x 1500 の範囲に制限されていることがわかります。

CC.Followのソースコード

ソースコードはCC.Action.jsにあります

上記は、CocosCreator でカメラ フォローに cc.follow を使用する方法の詳細です。CocosCreator でのカメラ フォローの詳細については、123WORDPRESS.COM の他の関連記事に注目してください。