Shapeをランダムな位置に表示させる【Phina.js】

Shapeをランダムな位置に表示させる

// グローバルに展開
phina.globalize();

var SCREEN_WIDTH = 640;
var SCREEN_HEIGHT = 960;
var SHAPE_SIZE = 16;
var SHAPE_HALF = SHAPE_SIZE / 2;

// メインシーン
phina.define("MainScene", {

  // 継承
  superClass: 'DisplayScene',

  //初期化
  init: function () {
    //親クラス初期化
    this.superInit();
    //背景色
    this.backgroundColor = 'lightgray';
    // Shapeを作成してシーンに追加
    var shape = Shape({
      width: SHAPE_SIZE,
      height: SHAPE_SIZE,
      backgroundColor: 'red',
    }).addChildTo(this);

    //画面上に収まるランダムな位置に配置
    shape.x = Random.randint(SHAPE_HALF, SCREEN_WIDTH - SHAPE_HALF);
    shape.y = Random.randint(SHAPE_HALF, SCREEN_HEIGHT - SHAPE_HALF);
  },

  //毎フレーム更新処理
  update: function () {

    //以下にコードを書いていく

  },
});

//メイン処理

phina.main(function () {
  // アプリケーションを生成
  var app = GameApp({
    // MainSceneから開始
    startLabel: 'main',
  });
  // fps表示
  //app.enableStats();
  //実行
  app.run();
});

▷画面上に収まるランダムな位置に表示

//画面上に収まるランダムな位置に配置
shape.x = Random.randint(SHAPE_HALF, SCREEN_WIDTH - SHAPE_HALF);
shape.y = Random.randint(SHAPE_HALF, SCREEN_HEIGHT - SHAPE_HALF);

SHAPE_HALFはShapeのサイズの半分の値で、Shapeが画面からはみ出さないようにrandintの範囲を調整している。
半分にしたのは、Shapeの座標は中心が起点(origin)になっているため。