Edited at

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

More than 1 year has passed since last update.

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


今回のTips

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

GIF.gif


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();
});