enchant.jsのLabelクラスで縁取り文字を作りたい

enchant.jsのLabelクラスで縁取り文字を作りたいのですが、方法が分かりません。
また、中央寄せ、右寄せにする事際にテキスト自身の幅を取得して右寄せなどを実装したいのですが this.widthとしてもcanvasのスクリーンのサイズが取得されてしまうためテキスト自身の幅を取得する方法が知りたいです。
中央寄せ
canvasの幅 / 2 - テキスト自身の幅 / 2

解答よろしくおねがいします。

##試したこと
プラグインのui.enchant.jsのScoreLabelでは縁取り文字で文字が表示されるため、ソースコードを見てみましたがそれらしい記述はなくわからなかったです。

行動規範の内容に同意します

回答1件

ベストアンサー

1.縁取り文字について
ちょっと調べてみましたが、Labelクラスでは縁取り文字は作れないようです。
ScoreLabelを調べてみましたが、MutableTextというメソッドを使っているようです。
プラグインのui.enchant.jsで、MutableText(enchant.ui.MutableText)を使えば縁取り文字を使えるようですが、数字とアルファベット以外は表示されないようです。色やサイズも変えるのは無理のようですね。
以下のコードで表示できました。

Javascript
1enchant(); // enchant.jsの有効化
2
3window.addEventListener("load", (evt) => {
4    console.log("hello world");
5    var core = new Core(320, 320);
6    core.preload("images/chara1.png");
7    core.onload = function (evt) {
8        var bear = new Sprite(32, 32);
9        bear.image = core.assets["images/chara1.png"];
10        bear.x = 10;
11        bear.y = 110;
12        core.rootScene.addChild(bear);
13        //var t = new ScoreLabel(0, 0);
14        //t.score = "1111";
15        //core.rootScene.addChild(t);
16        var m_text = new MutableText(0, 0, 100);
17        m_text.text = "AAAA";
18        //m_text.setText("111");
19        core.rootScene.addChild(m_text);
20    };
21    core.start();
22});

2.中央寄せについて
label.textAlign = "center";
で出来るようです。
enchant.Label
label._boundWidth でテキスト自身の幅を取得できます。

Javascript
1var label = new Label();
2//label.x = 280;
3//label.y = 5;
4label.color = "red";
5label.font = 'italic normal bold 100%/150% "ＭＳ Ｐゴシック",sans-seri';
6label.text = "0";
7label.textAlign = "center";
8label.on("enterframe", function () {
9    //label.text = (core.frame / core.fps).toFixed(2);
10    console.log(label._boundWidth);
11});