[phina.js-Tips] ラベルの幅と高さを調べる

[phina.js-Tips] ラベルの幅と高さを調べる:

※これまでのTipsはphina.js Tips集にまとめています。

今回のTips

LabelクラスはShapeクラスを継承しているので、デフォルトでは64X64のサイズが設定されています。そこで、実際のLabelの幅と高さを調べる方法について説明します。

calcCanvasHeight関数

ラベルの実際の高さを求めます。

var height = label.calcCanvasHeight(); 

calcCanvasWidth関数

var width = label.calcCanvasWidth(); 

ラベルの実際の幅を求めます。

動作サンプル

• ラベルが画面内を反射しながら動きます。

[runstantで確認]

サンプルコード

// グローバルに展開 
phina.globalize(); 
/* 
 * メインシーン 
 */ 
phina.define("MainScene", { 
  // 継承 
  superClass: 'DisplayScene', 
  // 初期化 
  init: function() { 
    // 親クラス初期化 
    this.superInit(); 
    // ラベル表示 
    var label = Label('Time is money').addChildTo(this); 
    label.setPosition(this.gridX.center(), this.gridY.center()); 
    // 実際のサイズを算出 
    label.width = label.calcCanvasWidth(); 
    label.height = label.calcCanvasHeight(); 
    // 枠を表示 
    RectangleShape({ 
      width: label.width, 
      height: label.height, 
      fill: null, 
      stroke: 'red', 
    }).addChildTo(label); 
 
    label.vx = label.vy = 4; 
 
    label.update = function() { 
      // ラベル移動 
      label.moveBy(label.vx, label.vy); 
      // 反射処理 
      if (label.right > 640 || label.left < 0) label.vx *= -1; 
      if (label.top < 0 || label.bottom > 960) label.vy *= -1; 
    }; 
  }, 
}); 
/* 
 * メイン処理 
 */ 
phina.main(function() { 
  // アプリケーションを生成 
  var app = GameApp({ 
    // MainScene から開始 
    startLabel: 'main', 
  }); 
  // fps表示 
  //app.enableStats(); 
  // 実行 
  app.run(); 
});