LabelクラスはEクラスを継承しています。 必要に応じてEクラスの情報も参照してください。
Labelクラスは、jgame.jsにおける文字情報をサポートするクラスです。 文字情報無しのゲームは少ないため、様々な場面で活用する事になります。 Labelクラスの使い方については、サンプルがもっとも有用な資料となるでしょう。 http://jgame-js.sourceforge.jp/label.html
実行環境によっては、このクラスの速度があまり出ない可能性があります。これはCanvasの文字描画APIが品質を重視しているため、ゲームのようなリアルタイム描画にそれほど向いておらず、品質と速度を両立していない実装の場合にはどうしても遅くなってしまう可能性があるためです。 ver 0.2現在まだクラスとしてはサポートされていませんが、Spriteを利用してビットマップフォントを再現したり、LabelクラスとBufferedRendererクラスを利用してビットマップフォントを内部的に生成したりする方法が、代替案をとして利用出来るかもしれません。
var label = new Label("Hello World", 13, "#ff0044", "alphabetic"); 表示する文字列、フォントサイズ、フォントカラー、ベースラインを指定してインスタンスを生成します。 全ての引数はオプションであり、省略してから後で設定する事も出来ます。 また、表示する文字列以外は設定しなくてもデフォルト値で動作する事が出来ます。
text:string;//現在のテキスト。変更する場合、setTextメソッドを利用してください maxWidth:number;//ラベル描画時の最大描画幅 syncObj: any;//synchronize用内部変数 syncProp: string;//synchronize用内部変数 syncRound: bool;//synchronize用内部変数
setMaxWidth(maxWidth:number) { maxWidth:number;//描画最大領域 ラベルの描画に利用可能な最大幅を指定します。 この値が指定された場合、何文字あろうと自動的にその幅に縮小されて描画されるようになります。 --- updateSize() { --- addShadow(color?:string) { color?:string;//影の色 ラベルに影を付けます。 --- removeShadow() { ラベルから影を削除します。 --- setText(text:string) { text:string;//設定する文字列 ラベルの文字列を変更します。 なお現在の文字列の取得は、textフィールドから直接取得してください。 --- setFont(fontString:string) { fontString:string;//設定するフォントの文字列 フォントを指定します。指定する方法はHTML5 CANVASのドキュメントを確認してください。 --- getFont():string { 現在利用されているフォントを取得します。 --- setFontSize(size:number) { size:number;//設定するフォントのサイズ フォントのサイズを変更します。指定する単位はピクセルです。 このメソッドは、setFontを利用してboldやitalicの書式を付与していた場合、正常な動作が行えなくなるバグがあります。setFontを利用した場合、setFontで直接フォントサイズを指定するようにしてください。 --- getFontSize():number { 現在のフォントサイズを取得します。 --- setTextAlign(align:string) { align:string; テキストの描画時に、どの方向に寄せるかを指定します。 start, end, left, right, centerのいずれかの値を設定出来ます。 デフォルト値はstartです。 --- getTextAlign():string { --- setTextBaseline(baseline:string) { baseline:string; テキスト描画時、どこを基準に縦位置を決めるかを指定します。 top, hanging, middle, alphabetic, ideographic, bottomのいずれかの値を設定出来ます。 デフォルト値はalphabeticです。 --- getTextBaseline():string { --- setColor(color:string) { color:string; 文字の色を指定します。CSSと同じ形態で指定してください。例えば、"#f00"は赤であり、"green"は緑であり、"#000000"は黒になります。 --- getColor():string { --- draw(area:Area, context:CanvasRenderingContext2D) { --- synchronize(obj:any, prop:string, round?:bool) { obj:any;//同期する対象のオブジェクト prop:string;//同期する対象のプロパティ名 round?:bool;//自動的にMath.roundによる四捨五入をするかどうか このメソッドを実行すると、以後Labelのテキストはtextフィールドの値ではなく、指定されたオブジェクトの指定されたプロパティの値と同期するようになります。 例えば常時移動しているオブジェクトのx, yの値や、キャラクターのライフ値などを表示するようなケースでこのメソッドを利用すると、Labelと各値を同期させるコーディングをする必要がなくなります。 ---