🎉

【Phaser】ゲーム開始時に星を特定の配置パターンの中からランダムで降らせる

2024/02/02に公開

星の出現パターンをランダムにするやり方

GitHub

解説

create() {
    // 星の配置パターンを配列で定義
    this.starPatterns = [
        // 様々な星の配置パターンを定義
        [{ x: 50, y: 0 }, { x: 150, y: 0 }, { x: 250, y: 0 }, /* ... */],
        [{ x: 70, y: 0 }, { x: 190, y: 0 }, { x: 310, y: 0 }, /* ... */],
        // 必要に応じてさらにパターンを追加
    ];

    // 星を格納するためのグループを作成
    this.stars = this.physics.add.group();

    // ランダムにパターンを選択
    let selectedPattern = Phaser.Utils.Array.GetRandom(this.starPatterns);

    // 選択されたパターンに基づいて星を作成し、グループに追加
    selectedPattern.forEach(pos => {
        let star = this.stars.create(pos.x, pos.y, 'star');
        star.setVelocityY(100); // 必要に応じて速度を調整
    });
}
  • 星の配置パターンの定義: this.starPatterns に複数の星の配置パターンを配列として定義しています。各パターンは、星のX座標とY座標をオブジェクトとして含んでいます。
  • 星のグループの作成: this.stars に this.physics.add.group() を使って星を格納するグループを作成します。これにより、後で一括で星に対する操作を行うことができます。
  • パターンのランダム選択: Phaser.Utils.Array.GetRandom メソッドを使って、定義されたパターンの中からランダムに一つを選択します。
  • 星の作成とグループへの追加: 選択されたパターンに基づいて、forEach ループを使って各星を作成します。this.stars.create を使って星を作成し、その位置をパターンに基づいて設定します。作成された星に対して、setVelocityY メソッドを使ってY軸方向の速度を設定します。

課題

星の速度の調整

setVelocityY メソッドを使用して、星の下降速度を変更してみてください。

function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}

Discussion