FlashでRGB分解
ネタ帳デラックス|Flashテクニック
「ネタ帳デラックス|Flashテクニック」という本を買いました。
帯に「FlashとActionScriptのテクニック集」と書かれているとおり、FlashとActionScriptを組み合わせたテクニカルなネタ集となっていて、ちょっと立ち読みして良さそうだったので購入しました。なるべく一つずつじっくりと内容を理解しつつ、試していこうと思います。
ネタ帳デラックス | Flashテクニック (MdN books)
- 作者: MdN編集部
- 出版社/メーカー: エムディエヌコーポレーション
- 発売日: 2008/09/18
- メディア: 大型本
- 購入: 3人 クリック: 9回
- この商品を含むブログ (7件) を見る
Neta No. 001を試す
で、最初にやった最初のネタが北川貴清さんの「赤緑青チャンネルを使った画像エフェクト」というもの。できあがりイメージは数のようになる。
チャンネル分解するデモである。どうやっているのかソースを見ると、ポイントは2つだ。
- BitmapDataクラスにあるcopyChannelというメソッドを使う.
- Bitmapクラスのblendmodeをいじる.
blendmodeはFlash上でもMovieClipに対して設定できるので、何となくその存在は分かるのだが、前者のcopyChannelメソッドはヘルプでも読まないと存在に気づかない!ヘルプから抜粋すると次のような定義になっている。
copyChannel () メソッド public function copyChannel( sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point, sourceChannel:uint, destChannel:uint) :void
sourceChannelとdestChannelには以下のような定数を使います。
- BitmapDataChannel.RED
- BitmapDataChannel.GREEN
- BitmapDataChannel.BLUE
- BitmapDataChannel.ALPHA
チャンネルのデータを個別に取得できるのですね。これは便利!!
というネタでした。
疑問が出てくる
しかし、完成swfを見ていて一つ疑問が出てくる。このネタの名前からはRGB分解し、RGB合成(加法混色)をやっている名前のようだが、上図を見て分かるように、見た目とか重なり具合がCMYK分解(減法混色)であることだ。
まぁ、この本はそのタイトルにあるとおりネタ帳なのでやっていることは間違いでも何でもないのですが、個人的にRチャンネルをRで描画していないところがとても気持ち悪い。
そこで、自分で納得いくように修正してみることにしてみました。
RGB合成への修正
背景を黒にします。
flaファイルで、ステージの背景を黒(#000000)に変更します。
ビットマップデータのクリア
新規作成したBitmapDataの内容をクリアします。
ChannelImage.asファイルの38行目あたりでBitmapDataをnewしたあとに、以下のようなコードで黒(#FF000000)で塗りつぶします。
rBmd.fillRect( photoBmd.rect, 0xFF000000 ); gBmd.fillRect( photoBmd.rect, 0xFF000000 ); bBmd.fillRect( photoBmd.rect, 0xFF000000 );
ブレンドモードの変更
ブレンドモードを乗算から加算に変更します。
ChannelImage.asファイルの49行目あたりのブレンドモードの設定をBlendMode.MULTIPLYからBlendMode.ADDに変更します。
ボタン色の変更
上記の変更で、RGB合成は完了ですが、ボタンの色がCMYなのでこれもついでにFlash上で変えておきます。
RGB分解デモ
ついでに、こないだ作ったFlickrから画像を取得する仕組みと組み合わせて、RGB合成するデモを作ってみました。RGB合成がどんなものか興味がある人はお試しください。