Cocos Creator で 3Dゲームを作るその３

Cocos Creator で 3Dブロック崩しゲームを作る続きです。

Cocos Creator で 3Dゲームを作るその２

Cocos Creator で 3Dブロック崩しゲームを作る続きです。今回の目標左右キーでバーを動かせるようにします。前回までのあらすじキャンバスの3Dステージに床と壁を使って枠を作りました。...

今回の目標
ボールを追加
1. ボールの設定を変更
ボールを動かす
衝突判定を付ける
動作確認
おわりに

今回の目標

ボールが動いて跳ね返る処理を作っていきます。

ボールを追加

まず、前回作った枠の中にボールを追加します。

New 3D Stage を選択してから右クリックで Create > Create 3D Node > Sphere の順で選択していきます。

ボールの設定を変更

追加した Sphere の設定を変更します。

名前を「Ball」に変更。
Position を「Y=20」に変更。
Scale を「X=25, Y=25, Z=25」に変更。
黄色のマテリアルを作成。
黄色のマテリアルをボールに設定。

以上の設定を施したのがこちらです。

ボールを動かす

次にボールが動くように設定します。

RigidBodyコンポーネントを追加

ボールにリジッドボディ3Dコンポーネントを追加することで、ボールが重力の影響を受けるようになります。

追加方法は、ボールを選択してから Add Component ボタンを押して Physics Component > Rigid Body 3D の順で選択します。

ボールに Rigid Body 3D が追加されればOK

Rigid Body 3D の設定を変更します。

Linear Damping (線形減衰) を 0 に変更します。そうすると、スピードが落ちなくなります。
Angular Damping (角ダンピング) を 0 に変更します。そうすると回転速度が落ちなくなります。

物理システムを有効にする

物理システムを有効にするために「Helloworld.ts」の start 関数を下記のように書き換えます。

start() {
    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);
    
    // 物理システムを有効にする.
    cc.director.getPhysics3DManager().enabled = true;
}

この状態で実行すると、ボールが床をすり抜けて下に落ちて行きます。

原因は、重力が Y軸方向に働いているからです。

今回のブロック崩しは無重力状態にして永遠にボールを動かしたいので「Helloworld.ts」の start 関数を下記のように書き換えます。

start() {
    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);
    
    // 物理システムを有効にする.
    cc.director.getPhysics3DManager().enabled = true;
    // ボールを止まらなくする.
    cc.director.getPhysics3DManager().allowSleep = false;
    // 無重力にする.
    cc.director.getPhysics3DManager().gravity = cc.v3(0,0,0);
}

この修正を行うと、ボールが下に落ちなくなります。しかし、ボールに力が加わっていないので静止してしまいます。

ボールに力を加える

「Helloworld.ts」を下記のように修正してボールに力を加えます。

const { ccclass, property } = cc._decorator;

@ccclass
export default class Helloworld extends cc.Component {

  @property(cc.Node)
  Ball: cc.Node = null;

  @property(cc.Node)
  Player: cc.Node = null;

  AccLeft: Boolean = false;
  AccRight: Boolean = false;

  start() {
      cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
      cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);
      
      // 物理システムを有効にする.
      cc.director.getPhysics3DManager().enabled = true;
      cc.director.getPhysics3DManager().allowSleep = false;
      cc.director.getPhysics3DManager().gravity = cc.v3(0,0,0);
 
      // ボールを動かす
      let rigidBody = this.Ball.getComponent(cc.RigidBody3D);
      rigidBody.applyImpulse(cc.v3(0, 0, 3000), cc.v3(0,0,0));
  }
  
  /* 省略 */
}

Canvas に登録してある Helloworldコンポーネントの Ball変数に Ballの実体を登録します。