PixelText by Tweener (4)
2007/09/13 20:10 - tweener
Pixelize クラスの基本的な部分は Grid クラスと似ています。
Grid クラスは、ステージ上に横 n 個×縦 m 個のセルを規則正しく並べます。
一方、Pixelize クラスは、横 n ピクセル×縦 m ピクセルの領域にセルを並べることになります。
Grid クラスと異なる点はその領域全てをセルで埋め尽くすのではなく、文字に見えるようにセルを生成・配置することは、皆さんお察しのことと思います。
この PixelText の元ネタは「FLASH HACKS」という書籍にあるという話をこのコーナーの第1回目にしましたが、オリジナルハックでは以下の手順で文字列を構成するピクセル群を生成していました。
- タイムラインに何らかの文字を入力したテキストフィールドを配置
- そのテキストフィールドを分解したうえでムービークリップに変換
- そのムービークリップの領域をピクセル単位で走査
- 走査した座標が文字の部分か否か hitTest() を使って判別
- 文字の部分だった場合にセル生成
「FLASH HACKS」は MX 2004 が対象なのでこういう手法が採用されています。
そして、この方法では 1. のため、あらかじめ定められた文字列しか表示されないという制限が発生するわけです。
私がモーションタイポ作品を作る際のポリシーは、ユーザーが入力した文字を対象とするというものなんですが、そうするとこの手順は使えません。
じゃあどうすんのよ。ああん？
この点は Flash 8 から導入されたビットマップ操作によって、いとも簡単にクリアできました。
すごいぞビットマップ操作えらいぞビットマップ操作。
Pixelize クラスでは、以下の手順で文字列を構成するピクセル群を生成しています。
- 指定した文字列を表示した AqLetter オブジェクトを生成
- その AqLetter オブジェクトを BitmapData に draw
- BitmapData をピクセル単位で走査
- 走査した座標が文字の部分か否か getPixel32() を使って判別
- 文字の部分だった場合にセル生成
実際の Pixelize クラスでは、厳密に言うと最後の処理が異なります。
そして、入力した文字列の数だけ、この過程をループするようになっていますが、元ネタとの比較のため、原理原則を記述しています。
次回はこの作品の実際の処理についての説明をおこないます。
シリーズ
- PixelText by Tweener (8)
- PixelText by Tweener (7)
- PixelText by Tweener (6)
- PixelText by Tweener (5)
- PixelText by Tweener (3)
- PixelText by Tweener (2)
- PixelText by Tweener (1)
