TextlayoutFrameworkFlash.text.OpenType

この投稿は7年半前の記事です。 情報が古くなっている可能性があるので、その点ご了承ください。
2009 年 8 月 21 日 2,774日前)
2,728文字 (読了時間6分)

SPONSORED LINK

最近気づいたにもかかわらず、日本語情報でこれだというのがないので、書いておきます。

わりと詳しいのはまつにおまかせさんのエントリーですが、その補足という感じです。

CFFフォントとは

Web上で日本語縦書きレイアウトを作る方法として有力なのがTextlayoutframeworkとFlash.text.engineなのですが、この2つは従来通りのやり方で埋め込みフォントを使うことができません。

というのは、TLFFTEはよりよい文字表現を実現するためなのかなんなのか、CFFというフォーマットを採用しているようです。これにより、アンチエイリアス処理なんかがきれいになるようなんですが、詳細はよくわかりません。

実際にFlex4 Gumboのリファレンスを見てみると、FTEFontLookupクラスはDEVICEとEMBEDDED_CFF定数しか持っていません。EMBEDDEDというのはないんですね。

FTEを拡張して作られているTLFもしかりです。

普通のTextfieldはembedFontをtrueにすれば埋め込みフォントを使えました。

単にプロパティが異なるだけなら問題ないのですが、困るのはCFFでのFontクラス作成がちょっと難しいということです。普通にFlash IDEとかで作っても認識してくれません。

よくやる方法としては、フォントを埋め込んだswfを作成して、それを外部から読み込み、内部で定義されているFontクラスを引っこ抜くというものだと思うのですが、これがCFFで埋め込まれていないとダメなんですね。

CFFでのフォント埋め込み方法

簡単に言うと、以下の流れです。FlexならMXML上で直接埋め込むこともできるのですが、Flash IDE(Flash Professionalのこと)で開発している人はそうもいかないと思うので、下記のやり方を覚えるのがいいと思います。

1.Flash Builder βかFlex SDK4 Gumboをダウンロード

Flash Builderは必須ではありません。要するに、Flex SDK 4以上を使いたいのです。

Flex SDK 3.*系だと、フォントをCFFでトランスコードするCFFFontManagerが入っていません。(多分)

Flex Builderを買う予定がないという方は我慢してSDKを使った方がいいと思います。以下、Flex SDKを前提に話を進めます。

2.フォントファイルのコピー

作業用フォルダ(この場合はHiraginoMincho)にOpenTypeフォントファイルをコピーします。Windowsなら「コントロールパネル>フォント」フォルダに入ってます。

3.クラスの作成

プロジェクトのメインファイル(HiraginoMincho.mxmlas)を作成し、下記のドキュメントクラスを定義します。

package {
   import flash.display.*;
   public class HiraginoMincho extends Sprite{
      [Embed(source="フォントファイルへのパス", fontName="HiraginoMincho", cff="true")]
      public static var font:Class;
      public function Mincho() {
      }
   }
}

4.コマンドラインでフォルダまで移動してコンパイル。

cd /path/to/working/directory/HiraginoMincho
mxmlc HiraginoMincho.mxml

5.別のswfで読み込んで使う

できあがったswfを読み込めば使うことができます。やり方は元エントリーに詳しいです。

フォント名が「クラス名_埋め込みClass変数」に変わるのでご注意。この例ではHiraginoMincho_fontになります。

注意点

Flex自体はデバイスフォントを埋め込むことができますが、CFFFontManagerはデバイスフォントを受け付けないようです。

したがって、フォントファイル自体をコピーしてEmbedタグのsource属性で指定することになります。

また、ヘルプを見るとこんなことが書いてあります。

To get the system font name in Windows, install the Font properties extension. Then right-click the font’s file in Windows Explorer and select the Names tab. Use the value under Font Family Name as the systemFont value.
Adobe Flex4 help – Using embedded fonts

「Windowsでデバイスフォント名を知りたい場合はフォントプロパティ拡張機能を使え」ということらしいのですが、これがすぐにわからなかったので、リンクを貼っておきます。

Microsoft Typography – Font properties extension, version 2.30

Microsoft Typographyなんてサイトがあったんですね。MSはまったくフォントに興味がないと思っていました。

というわけで、以上です。

追記

なんか環境を変えたら上手く行かなかったので、上手くいったソースを追記しておきます。

package{
   import flash.display.Sprite;
   public class main extends Sprite
   {
      [Embed(source="assets/ipamp.otf", fontName="IPAMincho", embedAsCFF="true")] //←ここが変わった
      public static var IPAMincho:Class;
      public function main()
      {
      }
   }
}

Embedの属性名が変わったのかな?

 

フォローしてください

ここで会ったのもなにかの縁。
高橋文樹.comの最新情報を見逃さないためにもフォローをお願いします。
めったに送らないメルマガもあります。

SPONSORED LINK

この記事について

この記事はが2009 年 8 月 21 日にプログラミングの記事として公開しました。

高橋先生の電子書籍

高橋先生の電子書籍

Amazonで電子書籍も買えます。

好きな言葉

文学と同じく、音楽も、感情を揺さぶり引っくり返し、そして、まったき悲しみや陶酔を生み出すものと定義することができる。文学と同じく、絵画も、感嘆の思いや世界に向けられた新たな視線を生み出す。しかし、ただ文学だけが、他の人間の霊と触れ合えたという感覚を与えてくれるのだ。その魂のすべて、その弱さと栄光、その限界、矮小さ、固定観念や信念。魂が感動し、関心を抱き、興奮しまたは嫌悪をもよおしたすべてのものと共に。

— ミシェル・ウエルベック

高橋先生の処女作

『途中下車』高橋文樹

2001年幻冬舎NET学生文学大賞受賞作です。

Web制作やります

Web制作やります

Web制作のご依頼は株式会社破滅派へ

不定期メルマガ

高橋文樹.comでは、不定期でニュースレターを配信しています。滅多に送らないので是非購読してください。

高橋文樹.comではプライバシーポリシーに準じて登録情報を取り扱います。