Web Premium をインストールして本格的にFlash CS4。ここのところ、縦書きを使うものを作っていたので、その過程で出てきたことを、ひとつ。

Flash Player 10 になって、ActionScript 3.0でテキスト表示をするには、2つの方法が用意されている（flashx.textLayout系もあるけど）。

1.flash.text系（TextFieldクラス）を使う
2.flash.text.engine系を使う

flash.text系はこれまでもあったやつなので最後に少し触れるだけにして、flash.text.engine系の話。
flash.text.engine系は、ただテキストを表示するだけでも結構まどろっこしい。

少しでも単純にするために、縦書きじゃなくて、横書きで考えてみる。

次のようなことをしたかった場合。
TextFieldでいいじゃん、と思うだろうけど、まどろっこしさを伝えるのはこれで十分なので。

完成イメージ

サンプルソース

以下、まどろっこしい部分解説。

単純な横書きの流れ

// 1.どんなフォーマットにするか決める（フォント）
var format : ElementFormat = new ElementFormat();

// 2.文字列とフォーマットをひもづける
var element : TextElement = new TextElement("フラッシュ・シーエス4（Flash CS4）",format);

// 3.段組みを用意する（横書き一行だけの表示なので、意味ないけど約束事）
var block : TextBlock = new TextBlock();

// 4.段組みと、要素（文字列、フォーマット）をひもづける
block.content = element;

// 5.段組みの中に行を作る
var line : TextLine = block.createTextLine();
addChild(line);
line.x = 10;
line.y = 50;

ぱっと見で問題は2つある。
1.位置がおかしい？
2.文字化けしたり、文字によってフォントがずれているんじゃないの？

ひとつずつ見てく。

位置がおかしい？
テキストラインは y = 50 にすると、そこから上に文字が出るイメージになる。
なので、テキストライン y = 0 にすると、画面の上にはみでることになるので、注意が必要。
文字が消えたよ、ってときは y の設定、注意。

最初、この問題はベースラインに関係するのかと思い、次のコードを追加して行のベースラインを上にしたけど、関係なし。

// ElementFormatのdominantBaselineプロパティを設定
format.dominantBaseline = TextBaseline.IDEOGRAPHIC_TOP;

いまんところの解決策は、行の高さ（TextLineのheightプロパティ）分、ずらす。

line.y = 50 + line.height;

続いて、文字化けやフォントの指定について。

文字化けしたり、文字によってフォントがずれているんじゃないの？
フォント指定していないので、FontDescriptionクラスを使って次のようにフォントを指定。

var font : FontDescription = new FontDescription("_ゴシック,_等幅");
var format : ElementFormat = new ElementFormat(font);

相変わらず文字化け。
なかぐろ『・』と終わり括弧『）』がダメ。

つぎにlocaleプロパティをセット。

format.locale = "ja";

なかぐろ『・』が出るようになった。相変わらず終わり括弧『）』が化ける。
さらに、フォントに『_ゴシック』指定しているのに、違って表示される。

もしや、と思って、フォントに『Osaka』を加えたら上手くいった。

でもこれは僕のMacに『Osaka』が入っているからで、Windowsの『Osaka』なしマシンでみると、終わり括弧『）』は化けている。

最終的に『ＭＳ Ｐゴシック』をWindows用に加えたら、Windowsでもちゃんと表示された。

var font : FontDescription = new FontDescription("_ゴシック,_等幅,Osaka,ＭＳ Ｐゴシック");

そのせいだと思うんですが、KAYACさんの_level0.KAYACで紹介されている記事『FlashPlayer10の新機能、段組クラス(縦書き)に触れてみた。』のサンプルも僕のMacだとフォントがないせいで、違った見栄えで表示される。ソースがダウンロードできるので、開いてみると、入っていないフォントが指定されている。

ということで、いろいろ想定されるフォントを指定しておかないと、いけないのかな？

あれ、これTextFieldクラスだとどうだったんだっけ？
と急に不安になり、_ゴシックのみ指定して試してみる。

この時点でMacでもWindowsでも、なかぐろ『・』や終わり括弧『）』が文字化けすることはない。大丈夫。

結論
flash.text.engine系を使うときは文字化けに気をつける。
フォントをたくさん指定しておく。

と書きつつも、ほんとかな、って気もしているので、情報ある人はコメントやトラックバックで教えて頂けると助かります。

関連記事
Flash Player 10 縦書き（xmlデータでテキストレイアウト）

参考記事
_level0.KAYAC FlashPlayer10の新機能、段組クラス(縦書き)に触れてみた。
アガテナ [flash][flex]Flash Player 10で追加されたテキストエンジンを使ってデバイスフォントを回転させる