HAKUHIN's home page
更新履歴
　
　


Bitmap クラスについて


・ビットマップクラスとは？
・ビットマップデータを作成して配置する
・ライブラリからビットマップデータを作成する
・ビットマップデータのバッファを解放する
・描画結果をビットマップデータにキャプチャーする
・イメージからピクセルカラーを取得する
・イメージにピクセルカラーを書き込む
・イメージを転送する
・イメージをスクロールする
・イメージにランダムノイズを発生させる
・イメージにPerlinノイズを発生させる
・イメージ間をマージでつなぐ
・イメージ間をピクセルディゾルブでつなぐ

前のページに戻る

　

ビットマップクラスとは？
　

■ BitmapData クラスとは？

BitmapData は、ビットマップの画像処理を行うためのクラスです。

ピクセルごとに色を取り出したり、色を書き込んだり、描画されたものをビットマップのデータとしてキャプチャーして取り込んだりといったアクセスが可能です。
　
■ Bitmap クラスとは？

その BitmapData をFlashPlayer上で表示するためのクラスが Bitmap です。BitmapクラスはBitmapDataクラスとセットで使用します。
　
Bitmap クラスは以下のクラスから派生しています。ここで解説してない分はリンク先に解説がありますので合わせてご覧下さい。
　
Object
↓派生
EventDispatcher
↓派生
DisplayObject
↓派生
Bitmap
　
　
上に戻る

　

ビットマップデータを作成して配置する



サンプルをダウンロード
bitmap_00_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　


１．ビットマップデータを作成する

ビットマップデータを作るにはBitmapDetaクラスをインスタンス化します。
　
new BitmapData ( 幅 , 高さ , 32bitカラーか？ , 0xFFFFFFFF );
第01引数 ビットマップの幅
第02引数 ビットマップの高さ
第03引数(略可)true = 32ビットカラー、false = 24ビットカラー（アルファなし）
※変更は不可
第04引数(略可)ビットマップの初期カラー
32bitカラーなら0xFFFFFFFF(ARGB)
24bitカラーなら0xFFFFFF(RGB)を指定
戻り値 BitmapData インスタンス
　
幅 300 高さ 200 カラーを 0xFF0000FF で初期化してビットマップデータを作成

// BitmapData オブジェクトを作成する
var bmp_data : BitmapData = new BitmapData( 300 , 200 , true , 0xFF0000FF);
　
FlashPlayer9 以前は、幅と高さが 2880 ピクセルまで扱えます。

FlashPlayer10 以降は、幅と高さが 8192 ピクセルまで扱えますが、総ピクセル数は 16777216 までとなります。(幅が 8192 なら高さは 2048 まで)
　
第04引数で「ビットマップの初期カラー」を指定する時にアルファ成分が低いと、指定したＲＧＢ成分と実際に初期化されたカラーとが変わるようです。特にアルファ成分が 0 の場合は 0x00000000 で初期化されるようです。
　
２．ビットマップインスタンスを作成する

ビットマップデータを表示するには Bitmap クラスを使用します。
　
new Bitmap ( ビットマップデータ , スナップの種類 , スムージング？ );
第01引数 BitmapData を指定
第02引数(略可)スナップの種類　PixelSnapping.*
第03引数(略可)true = スムージング（補間）をかける 、 false = 何もしない
戻り値 Bitmap インスタンス
　
ビットマップデータからビットマップインスタンスを作成する

// BitmapData オブジェクトを作成する
var bmp_data : BitmapData = new BitmapData( 300 , 200 , true , 0xFF0000FF);

// Bitmap オブジェクトを作成する
var bmp_obj : Bitmap = new Bitmap( bmp_data , PixelSnapping.AUTO , true);
　
■第02引数 スナップの種類

第06引数で設定するスナップの種類です。
　
定数文字説明
PixelSnapping.NEVER"never"ピクセルの吸着なし
PixelSnapping.ALWAYS"always"近いピクセルに吸着
PixelSnapping.AUTO"auto"回転や傾斜なしで、99.9% ～ 100.1% のスケール時に近いピクセルに吸着(ベクタレンダラで高速描画とか）
　
bitmapData プロパティを使えばインスタンス化した後でもビットマップデータを変更することができます。
　
Bitmap オブジェクトに BitmapData オブジェクトを割り当てる

// BitmapData オブジェクトを作成する
var bmp_data : BitmapData = new BitmapData( 300 , 200 , true , 0xFF0000FF);

// Bitmap オブジェクトを作成する
var bmp_obj : Bitmap = new Bitmap(null);

// Bitmap オブジェクトにBitmapData オブジェクトをセットする
bmp_obj.bitmapData = bmp_data;
　
３．Flash上に配置して表示する

ビットマップインスタンスを表示リストに登録して表示します。
　
ビットマップインスタンスを表示する

// BitmapData オブジェクトを作成する
var bmp_data : BitmapData = new BitmapData( 300 , 200 , true , 0xFF0000FF);

// Bitmap オブジェクトを作成する
var bmp_obj : Bitmap = new Bitmap( bmp_data , PixelSnapping.AUTO , true);

// Bitmap オブジェクトを表示する
stage.addChild(bmp_obj);
　

上に戻る
　
　

ライブラリからビットマップデータを作成する


サンプルをダウンロード
bitmap_01_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　


１．画像を swf ファイルに埋め込む

Flash のライブラリウィンドウに画像を読み込んでおきます。画像を選択して右クリックメニューからリンケージプロパティを開きます。
　
　
「クラス」に好きなクラス名を付けます。ここでは MyBmp クラスという名前を付けています。

「基本クラス」に flash.display.BitmapData と記述します。

『ActionScript に書き出し』と『最初のフレームに書き出し』にチェックを付けます。
　
この状態で書き出せば swf ファイルに画像データが埋め込まれるようになります。後はアクションスクリプトを使って動的に呼び出して使用します。
　
２．クラスをインスタンス化してビットマップデータを作成する

先ほど名前を付けたクラス名でインスタンス化するとビットマップデータを作成することができます。
　
注意点としては、このクラスをインスタンス化するには、第01引数と第02引数にダミーの数値を入れる必要があります。
　
設定した MyBmp クラスをインスタンス化してビットマップデータを作成する

var bmp_data : BitmapData = new MyData( 0 , 0 );
var bmp_obj : Bitmap = new Bitmap(bmp_data);
stage.addChild(bmp_obj);
　

上に戻る
　
　

ビットマップデータのバッファを解放する




サンプルをダウンロード
bitmap_02_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　


■ビットマップデータのバッファを開放する

ビットマップデータのメソッドである dispose() を呼び出すと、ピクセルカラーのバッファが解放され、高さ 0 幅 0 のイメージを持つビットマップデータとなります。 BitmapData オブジェクト自体は破棄されずに残ります。
　
ビットマップデータのバッファをクリアする

var bmp_data : BitmapData = new BitmapData( 400 , 300 , false , 0xFF0000);
bmp_data.dispose();	// メモリ開放

var bmp_obj : Bitmap = new Bitmap(bmp_data);
stage.addChild(bmp_obj);
　

上に戻る
　
　

描画結果をビットマップデータにキャプチャーする



サンプルをダウンロード
bitmap_03_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　


■Flash のレンダラ結果をビットマップデータに描画する

Flash 上で描画されたものをビットマップデータに描画するは draw() メソッドを使用します。
　
サンドボックス制限のある素材が含まれていると、エラーとなります。
　
BitmapData.draw ( ソース用ビットマップデータ , Matrix , ColorTransform , ブレンドの種類 , Rectangle , スムージング？ );
第01引数 キャプチャーしたい DisplayObject か、BitmapData を指定
第02引数(略可)ソースの姿勢をMatrix型で指定
第03引数(略可)ソースのカラー変換をColorTransform型で指定
第04引数(略可)ブレンドの種類 BlendMode.*
第05引数(略可)ソースをクリッピングするための矩形をRectangle型で指定
nullの場合、ソースの描画矩形領域が使われる
第06引数(略可)true = スムージング（補間）をかける 、 false = 何もしない
(第01引数がビットマップデータの場合に動作)
戻り値 なし
　
stage に描かれた描画結果をビットマップデータにキャプチャーする

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFFFFFF);

var matrix : Matrix = new Matrix(1,0,0,1,0,0);
var color : ColorTransform = new ColorTransform(1,1,1,1,0,0,0,0);
var rect : Rectangle = new Rectangle(0,0,400,300);
bmp_data.draw(stage, matrix, color, BlendMode.NORMAL, rect, true);
　
■第02引数 ソースの姿勢変換

第05引数でクリッピングしたイメージデータの姿勢を、行列で指定します。
ソースイメージの左上の座標が原点にきます。



　
ビットマップデータのイメージ領域にソースイメージをテクスチャとして貼るような形で行列を指定します。



　
■第04引数 ブレンドの種類

第04引数で設定するブレンドの種類です。
　
定数文字一般名称
BlendMode.NORMAL"normal"通常
BlendMode.LAYER"layer"レイヤー
BlendMode.MULTIPLY"multiply"乗算
BlendMode.SCREEN"screen"スクリーン
BlendMode.LIGHTEN"lighten"比較 (明)
BlendMode.DARKEN"darken"比較 (暗)
BlendMode.DIFFERENCE"difference"差の絶対値
BlendMode.ADD"add"加算
BlendMode.SUBTRACT"subtract"減算
BlendMode.INVERT"invert"反転
BlendMode.ALPHA"alpha"アルファ
BlendMode.ERASE"erase"消去
BlendMode.OVERLAY"overlay"オーバーレイ
BlendMode.HARDLIGHT"hardlight"ハードライト
　
■第05引数 ソースのクリッピング

ソースの上下左右の端を切り落としてクリッピングします。ソースに任意のインスタンスを指定している場合は、Rectangleはインスタンスのローカル座標系となります。
x成分とy成分が負の値の場合、正しく描画できないようです。
　
ソースのインスタンスを赤色で指定した矩形でクリッピングすると…

　
↓
　
矩形で囲まれた部分がソースとして使用されるようになる

　

上に戻る
　
　

イメージからピクセルカラーを取得する



サンプルをダウンロード
bitmap_04_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■24ビットのピクセルカラーを取得する

getPixel() メソッドを使用すると、該当する座標のピクセルの色を
24ビットカラー（ＲＧＢ）として取得することができます。
　
BitmapData.getPixel ( x座標 , y座標 );
第01引数 ビットマップデータの x 座標
第02引数 ビットマップデータの y 座標
戻り値 24bitカラーを返す0xFFFFFF(RGB)
　
ビットマップデータの横20,縦30の位置にある24ビットピクセルカラーを取得する

var bmp_data : BitmapData = new BitmapData( 400 , 300 , false , 0xFF8800);

var color  : uint = bmp_data.getPixel(20,30);
var _red   : uint = (color >> 16) & 0xFF;
var _green : uint = (color >>  8) & 0xFF;
var _blue  : uint = (color >>  0) & 0xFF;
　
■32ビットのピクセルカラーを取得する

getPixel32() メソッドを使用すると、該当する座標のピクセルの色を
32ビットカラー（ＡＲＧＢ）として取得することができます。
　
BitmapData.getPixel32 ( x座標 , y座標 );
第01引数 ビットマップデータの x 座標
第02引数 ビットマップデータの y 座標
戻り値 32bitカラーを返す0xFFFFFFFF(ARGB)
　
ビットマップデータの横20,縦30の位置にある32ビットピクセルカラーを取得する

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFF8000);

var color  : uint = bmp_data.getPixel32(20,30);
var _alpha : uint = (color >> 24) & 0xFF;
var _red   : uint = (color >> 16) & 0xFF;
var _green : uint = (color >>  8) & 0xFF;
var _blue  : uint = (color >>  0) & 0xFF;
　
■矩形範囲に該当する32ビットのピクセルカラーをまとめて取得する

getPixels() メソッドを使用すると、該当する矩形に入っているピクセルの色をまとめてByteArray 型の配列に格納して取得することができます。
　
BitmapData.getPixels ( Rectangle );
第01引数 ビットマップデータの範囲をRectangle 型で指定
戻り値 ByteArray 型の配列。32bitカラー(ARGB) の連続したデータ
　
矩形 (x=50,y=100,w=200,h=100) の中にあるピクセルカラーをまとめて取得する

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFF8000);

var rect : Rectangle = new Rectangle(50, 100, 200, 100);
var stream : ByteArray = bmp_data.getPixels(rect);

var i;
var num = stream.length;
for(i=0;i < num;){
	var _alpha = stream[i++];
	var _red   = stream[i++];
	var _green = stream[i++];
	var _blue  = stream[i++];
}
　
データは、左上から右に順番にアクセスしていく感じで、

(１ピクセル目) 透過 | 赤色 | 緑色 | 青色 | (２ピクセル目) 透過 | 赤色 | 緑色 | 青色 …

という並びで１バイトずつ順番に格納されます。
　

上に戻る
　
　

イメージにピクセルカラーを書き込む



サンプルをダウンロード
bitmap_05_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■ロックとアンロック

ピクセルカラーを書き込む処理をする直前に、 lock() メソッドを呼び出してロックをかけます。これにより、書き込み系のメソッドを呼ぶたびに更新処理が走るのを抑制します。
　
引数にRectangle型で矩形を指定すると、「更新したのはこの範囲だけですよ」という事を通知することができます。
　
BitmapData.lock( [矩形] );
第01引数(略可)更新したい範囲を指定 null なら全体が更新されたことを通知する
戻り値 なし
　
一連の書き込み処理が終わったらunlock() メソッドを呼び出してロックを解除します。
　
この時点で更新された事が参照先に通達されるので、結果パフォーマンスが向上します。
　
使用例です。
　
ロックとアンロックを使って書き込む

var i,j;
var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);

var time = getTimer();

// ロック
bmp_data.lock();

// 一連の書き込み処理
for (i=0; i<512; i++) {
	for (j=0; j<512; j++) {
		bmp_data.setPixel32(i,j ,Math.floor(Math.random() * 0xFFFFFFFF));
	}
}

// ロック解除
bmp_data.unlock();

// 経過時間測定
trace(getTimer() - time);
　

　
■該当する座標のピクセルに24ビットのピクセルカラーを書き込む

setPixel() メソッドを使用すると、該当する座標に24ビットカラー（ＲＧＢ）で書き込むことができます。
　
BitmapData.setPixel ( x座標 , y座標 , 0xFFFFFF );
第01引数 x 座標
第02引数 y 座標
第03引数 24bitカラーを指定 0xFFFFFF (RGB)
戻り値 なし
　
横 20 ,縦 30 の位置に24ビットピクセルカラーを書き込む

var bmp_data : BitmapData = new BitmapData( 400 , 300 , false , 0xFFFFFF);

var _red   : uint = 255;
var _green : uint =   0;
var _blue  : uint = 128;
var color  : uint = (_red << 16) | (_green << 8) | (_blue);

bmp_data.setPixel(20,30,color);

stage.addChild(new Bitmap(bmp_data));
　
■該当する座標のピクセルに32ビットのピクセルカラーを書き込む

setPixel32() メソッドを使用すると、該当する座標に32ビットカラー（ＡＲＧＢ）で書き込むことができます。
　
アルファ値は、指定した値が正確に代入されません。何らかの近似値となります。
　
BitmapData.setPixel32 ( x座標 , y座標 , 0xFFFFFFFF );
第01引数 x 座標
第02引数 y 座標
第03引数 32bitカラーを指定 0xFFFFFFFF (ARGB)
戻り値 なし
　
横 20 ,縦 30 の位置に32ビットピクセルカラーを書き込む

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFFFFFF);

var _red   : uint = 255;
var _green : uint =   0;
var _blue  : uint = 128;
var _alpha : uint = 255;
var color  : uint = (_alpha << 24) | (_red << 16) | (_green << 8) | (_blue);

bmp_data.setPixel32(20,30,color);

stage.addChild(new Bitmap(bmp_data));
　
■矩形範囲に該当するピクセルに32ビットカラーとしてまとめて書き込む

setPixels() メソッドを使用すると、該当する矩形範囲にByteArray 型の配列を使ってまとめて32ビットカラー（ＡＲＧＢ）で書き込むことができます。

24ビットカラーのビットマップデータに書き込みたい場合でもアルファ成分にダミーのデータを入れて32ビットカラーとして指定します。
　
アルファ値は、指定した値が正確に代入されません。何らかの近似値となります。
　
BitmapData.setPixels ( Rectangle , ByteArray );
第01引数 適用する矩形範囲をRectangle型で指定
第02引数 カラーをまとめてByteArray型で指定　（サイズは 矩形の幅 * 矩形の高さ * 4）
戻り値 なし
　
矩形領域 ( x=0 , y=0 , w=400 , h=300 ) にByteArray型でまとめて書き込む

// 適当なカラーデータ
var i;
var stream : ByteArray = new ByteArray();
var num = 400 * 300 * 4;
for (i=0; i < num; ) {
	var _alpha = Math.floor(Math.random() * 0xFF);
	var _red   = Math.floor(Math.random() * 0xFF);
	var _green = Math.floor(Math.random() * 0xFF);
	var _blue  = Math.floor(Math.random() * 0xFF);
	stream[i++] = _alpha;
	stream[i++] = _red;
	stream[i++] = _green;
	stream[i++] = _blue;
}

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFFFFFF);
var rect : Rectangle = new Rectangle(0, 0, 400, 300);
bmp_data.setPixels(rect,stream);

stage.addChild(new Bitmap(bmp_data));
　
データは、左上から右に順番にアクセスしていく感じで、

(１ピクセル目) 透過 | 赤色 | 緑色 | 青色 | (２ピクセル目) 透過 | 赤色 | 緑色 | 青色 …

という並びで１バイトずつ順番に格納します。
　

　
■イメージに単一色の矩形を描画する

fillRect() メソッドを使用すると、イメージに対して矩形でピクセルを塗りつぶすことができます。
　
BitmapData.fillRect ( Rectangle , ピクセルカラー );
第01引数 適用する矩形範囲をRectangle型で指定
第02引数 カラーを指定 24bitカラーの場合 0xFFFFFF(RGB)、32bitカラーの場合 0xFFFFFFFF(ARGB)
戻り値 なし
　
矩形領域 ( x=50 , y=50 , w=300 , h=200 ) を 0xFFFF0000 で塗りつぶす

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFFFFFF);
var rect : Rectangle = new Rectangle(50, 50, 300, 200);
bmp_data.fillRect(rect , 0xFFFF0000);

stage.addChild(new Bitmap(bmp_data));
　

　
■連続している同じ色部分を塗りつぶす

floodFill() メソッドを使用すると、該当するピクセルからペイントツールの「塗り機能」のように、連続している同じ色部分を塗り潰す事ができます。
　
BitmapData.floodFill ( x 座標 , y 座標 , ピクセルカラー );
第01引数 塗りつぶしを開始するイメージの x 座標
第02引数 塗りつぶしを開始するイメージの y 座標
第03引数 ピクセルカラーを指定 24bitカラーの場合 0xFFFFFF(RGB) 、32bitカラーの場合 0xFFFFFFFF(ARGB)
戻り値 なし
　
座標 (100,50 ) から連続している同じ色を 0xFFFF0000 で塗りつぶす

var bmp_data : BitmapData = new BitmapData( 400 , 300 , true , 0xFFFFFFFF);
bmp_data.floodFill(100 , 50 , 0xFFFF0000);

stage.addChild(new Bitmap(bmp_data));
　

上に戻る
　
　

イメージを転送する



　
■クローンを作成する

サンプルをダウンロード
bitmap_06_00_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
ビットマップデータのイメージをコピーして、新しいBitmapData オブジェクトを作成するには、clone() メソッドを使用します。
　
BitmapData.clone( );
第01引数 なし
戻り値 新しいBitmapData オブジェクト
　
bmp_data を 複製して copy_bmp インスタンスを作成する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var copy_bmp : BitmapData = bmp_data.clone();
　
　

　
■イメージを転送する

サンプルをダウンロード
bitmap_06_01_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
ビットマップデータのイメージを別のビットマップデータのイメージに高速で転送するには、copyPixels() メソッドを使用します。

ビットマップデータから別のビットマップデータへ転送するだけでなく、さらにアルファ成分のみ転送される２枚目のソースの指定して合成する事もできます。
　
BitmapData.copyPixels( １枚目のビットマップデータ, Rectangle, Point , ２枚目のビットマップデータ , Point , アルファブレンディング？);
第01引数 コピー元のビットマップデータ
第02引数 ソースのイメージのどの矩形部分を使用するかをRectangle型で指定
第03引数 第02座標で決めた矩形を、イメージ領域のどこに置くかをPoint型で指定
第04引数(略可)２枚目のコピー元のビットマップデータ（アルファ成分のみ転送される）
第05引数(略可)第04引数で指定したソースをイメージ領域のどこに置くかをPoint型で指定
第06引数(略可)元のイメージとアルファブレンディングする場合は true 、ピクセルの転送なら false
戻り値 なし
　
■第04引数 アルファ用ソースを指定

2枚目のソースを指定した場合は、2枚目のソースのアルファ成分が1枚目のソースと合成されて転送されます。使用しない場合はnullを指定します。

第01ソース 第02ソース 転送後のイメージ
　
第01ソース 第02ソース 転送後のイメージ
　
■第06引数 アルファブレンディングを使用するか

コピー元と転送先のイメージとでアルファブレンディングしたい場合はtrue を指定します。転送先に存在するイメージを上書きして塗りつぶしたい場合はfalse を指定します。
　
使用例です。
　
source から bmp_data に転送する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var source : BitmapData = new BitmapData( 512 , 512 , true , 0xFF0080FF);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

bmp_data.copyPixels(source,rect,pos);
　
source1 と source2(透過のみ) を合成してから、 bmp_data に転送する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var source1 : BitmapData = new BitmapData( 512 , 512 , true , 0xFF0080FF);
var source2 : BitmapData = new BitmapData( 512 , 512 , true , 0x80000000);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

bmp_data.copyPixels(source1,rect,pos,source2,pos,false);
　

　
■チャンネルを指定して転送する

サンプルをダウンロード
bitmap_06_02_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
赤色、緑色、青色、透過　の４種類のうち、各色の成分１つだけの転送を行うには、copyChannel()　メソッドを使用します。

転送元と転送先のチャンネルは別にする事ができます。 例えば、転送元の赤色成分を、転送先の青色成分へ流し込むといった事が可能です。
　
BitmapData.copyChannel( ビットマップデータ, Rectangle, Point , 転送元チャンネル , 転送先チャンネル );
第01引数 転送元のビットマップデータ
第02引数 ソースのイメージのどの矩形部分を使用するかをRectangle型で指定
第03引数 第02座標で決めた矩形を、イメージ領域のどこに置くかをPoint型で指定
第04引数(略可)転送元のチャンネルを指定 BitmapDataChannel.*
第05引数(略可)転送先のチャンネルを指定 BitmapDataChannel.*
戻り値 なし
　
■第04-05引数 チャンネルの指定

定数数値解説
BitmapDataChannel.RED1赤色チャンネル
BitmapDataChannel.GREEN2緑色チャンネル
BitmapDataChannel.BLUE4青色チャンネル
BitmapDataChannel.ALPHA8透過チャンネル
　
使用例です。
　
source の赤色成分を bmp_data の青色成分に転送する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF0000);
var source : BitmapData = new BitmapData( 512 , 512 , true , 0xFF880000);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

bmp_data.copyChannel(source,rect,pos,BitmapDataChannel.RED,BitmapDataChannel.BLUE);
　

上に戻る
　
　

イメージをスクロールする



サンプルをダウンロード
bitmap_07_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■イメージのスクロール

ビットマップデータのイメージをドット単位でずらしたい場合に使用します。移動して画面外に消えた領域は失われます。
　
　
↓
　
　
BitmapData.scroll( x 軸方向の移動量, y 軸方向の移動量);
第01引数 スクロールする x 軸方向の移動量
第02引数 スクロールする y 軸方向の移動量
戻り値 なし
　
x方向に20, y方向に10ピクセルスクロールする

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);

bmp_data.scroll(20,10);
　
　

上に戻る
　
　

イメージにランダムノイズを発生させる



サンプルをダウンロード
bitmap_08_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■イメージにランダムノイズを発生させる

ランダムノイズを発生させるにはnoise()メソッドを使用します。
　
BitmapData.noise( 乱数の種, カラー最小, カラー最高 , チャンネル , グレースケールか？);
第01引数 適当な整数
第02引数 各カラー成分の最小値(0 ～ 255)
第03引数 各カラー成分の最大値(0 ～ 255)
第04引数 カラーチャンネルをビットで指定　0x01(赤) 0x02(緑) 0x04(青) 0x08(透)
第05引数 true = グレースケール化, false = 第4引数で指定したカラーチャンネル
戻り値 なし
　
ランダムノイズを表示する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);

var rand = Math.floor(Math.random() * 0xFFFF);	// 適当な乱数
bmp_data.noise(rand ,0 , 255 , (8|4|2|1) , false);

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);
　
　

上に戻る
　
　

イメージにPerlinノイズを発生させる



サンプルをダウンロード
bitmap_09_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■イメージにPerlinノイズを発生させる

Perlinノイズを発生させるにはperlinNoise()メソッドを使用します。
　
BitmapData.perlinNoise( 幅周波数, 高さ周波数, 重ね回数 , 乱数の種 , フラクタルノイズ？ , カラーチャンネル , グレイスケール？ , Point型が入った配列);
第01引数 x 方向で使用する周波数(幅)
第02引数 y 方向で使用する周波数(高さ)
第03引数 重ねる回数　やりすぎると重い
第04引数 適当な整数
第05引数 補正があり、タイリング可能なノイズ生成を試みる(第09引数でスクロール時に効果的)
第06引数 フラクタルノイズの有無。falseの場合、炎や海の波のような視覚効果
第07引数(略可)カラーチャンネルをビットで指定　0x01(赤) 0x02(緑) 0x04(青) 0x08(透)
第08引数(略可)グレイスケールの有無
第09引数(略可)第03引数で決めた各レイヤーをスクロールするためのPoint型の配列データ
戻り値 なし
　
■第06引数 フラクタルノイズの有無

true false
　
■第09引数 Point型の配列データ

第03引数で指定した数だけレイヤーが生成されます。この各レイヤーを座標を設定するためのパラメータです。
　
Point 型の配列を指定します。 例えば第03引数で 3 と指定した場合は、配列で 3 つ分の Point オブジェクトを渡す事ができます。
　
座標を毎フレーム少しずつ増減させるとスクロールして動いているように見えます。
　
　
第09引数に渡すパラメータ

var offset = new Array();
offset[0] = new Point(0  , 0);	// 01番目のオフセット
offset[1] = new Point(20 ,20);	// 02番目のオフセット
offset[2] = new Point(50 ,10);	// 03番目のオフセット
　
使用例です。
　
Perlinノイズを表示する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);

var rand = Math.floor(Math.random() * 0xFFFF);	// 適当な乱数
bmp_data.perlinNoise(64 ,64 , 1 , rand , false , true , (8|4|2|1));

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);
　
スクロールするPerlinノイズを表示する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);

var rand = Math.floor(Math.random() * 0xFFFF);	// 適当な乱数
var offset = [
	new Point(0,0),
	new Point(0,0),
];

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);

stage.addEventListener(Event.ENTER_FRAME ,function (event){
	offset[0].x += 2;
	offset[1].y += 5;
	bmp_data.perlinNoise(64 ,64 , 2 , rand , false , true , (8|4|2|1) , false , offset);
});
　
　

上に戻る
　
　

イメージ間をマージでつなぐ



サンプルをダウンロード
bitmap_10_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■イメージ間をマージでつなぐ

２つのビットマップデータを用意します。
　
ビットマップデータの
イメージ		 ソース用のイメージ
　
この２つのイメージ間をマージで補間するには、merge()メソッドを使用します。
　
合成された結果は、メソッドを呼び出したビットマップデータのイメージ側に出力されます。
　
上書きされたイメージ ソース用のイメージ
　
BitmapData.merge( ビットマップデータ, Rectangle, Point , 赤色乗算 , 緑色乗算 , 青色乗算 , 透過乗算);
第01引数 ソース用のビットマップデータ（呼び出し元とは別のビットマップデータ）
第02引数 ソースのイメージのどの矩形部分を使用するかをRectangle型で指定
第03引数 第02座標で決めた矩形を、イメージ領域のどこに置くかをPoint型で指定
第04引数 赤チャンネル値と乗算する数値(0～255)
第05引数 緑チャンネル値と乗算する数値(0～255)
第06引数 青チャンネル値と乗算する数値(0～255)
第07引数 透明度の値と乗算する数値(0～255)
戻り値 なし
　
使用例です。
　
マージで補間する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var source : BitmapData = new BitmapData( 512 , 512 , true , 0xFF0080FF);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

bmp_data.merge(source , rect, pos , 128, 128, 128, 128);

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);
　
２つのビットマップイメージソース間をマージで徐々に変化させる

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFFFFFF);
var source1 : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF8000);
var source2 : BitmapData = new BitmapData( 512 , 512 , true , 0xFF0080FF);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);

var d = 0;
stage.addEventListener(Event.ENTER_FRAME ,function (event){
	d += 1;
	if(d > 255)	d = 0;
	bmp_data.copyPixels(source1, rect, pos);
	bmp_data.merge(source2, rect, pos, d, d, d, d);
});
　

上に戻る
　
　

イメージ間をピクセルディゾルブでつなぐ



サンプルをダウンロード
bitmap_11_fla09_as3.flaAdobe Flash CS3 AcrionScript3.0
　
　
■イメージ間をピクセルディゾルブでつなぐ

２つのビットマップデータを用意します。
　
ビットマップデータの
イメージ		 ソース用のイメージ
　
この２つのイメージ間をピクセルディゾルブで補間するには、pixelDissolve()メソッドを使用します。
　
このメソッドは繰り返して呼び出す必要があります。メソッドを呼び出したビットマップデータのイメージ側に出力されます。
　
上書きされたイメージ ソース用のイメージ
　
BitmapData.pixelDissolve( ビットマップデータ, Rectangle, Point , 乱数の種 , 変化するドット数 , 塗りつぶしカラー);
第01引数 ソース用のビットマップデータ（呼び出し元とは別のビットマップデータ）
第02引数 ソースのイメージのどの矩形部分を使用するかをRectangle型で指定
第03引数 第02座標で決めた矩形を、イメージ領域のどこに置くかをPoint型で指定
第04引数(略可)適当な整数
第05引数(略可)１回のメソッド呼び出しで変化するピクセル数
第06引数(略可)塗りつぶしカラー 0xFFFFFFFF(ARGB) か 0xFFFFFF(RGB)
ビットマップデータとソースが同一の場合に動作
戻り値 次回呼び出すときに指定する乱数の種
　
■第04引数 乱数の種

このメソッドは繰り返して何度も呼び出す必要があります。
　
初回呼び出し時は適当な値を入れておきます。２回目は、１回目の戻り値で得られた値を第04引数にセットしてメソッドを呼び出します。３回目は、２回目の戻り値で得られた値を第04引数にセットしてメソッドを呼び出します。
　
戻り値で得られた値を次のメソッド呼び出し時に使用するという動作を何度も繰り返します。
　
■第05引数 １回のメソッド呼び出しで変化するピクセル数

ピクセルディゾルブで計算する総ピクセル数は、変化させる矩形の幅と高さで決まります。
　
例えば幅512 高さ512 のビットマップイメージの場合は、512 * 512 = 262144 となります。 このイメージを 30 回繰り返し呼び出していい感じに終わらせたい場合は 262144 / 30 = 約 8738 回を指定します。
　
使用例です。
　
ピクセルディゾルブで補間する

var bmp_data : BitmapData = new BitmapData( 512 , 512 , false , 0xFFFF8000);
var source : BitmapData = new BitmapData( 512 , 512 , false , 0xFF0080FF);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);

var rand = 0;
stage.addEventListener(Event.ENTER_FRAME ,function (event){
	rand = bmp_data.pixelDissolve(source , rect, pos ,rand , 1000);
});
　
ピクセルディゾルブを使って単一カラーで塗りつぶす

var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF0000);

var rect = new Rectangle(0,0,512,512);
var pos = new Point(0,0);

var bmp = new Bitmap(bmp_data);
stage.addChild(bmp);

var rand = 0;
stage.addEventListener(Event.ENTER_FRAME ,function (event){
	rand = bmp_data.pixelDissolve(bmp_data , rect, pos ,rand , 1000 , 0xFF0000FF);
});
　
　

上に戻る
　
　
前のページに戻る
コンテンツ
　
問答収集
NEW
　
PR
　
広告

HAKUHIN's home page バナー http://hakuhin.jp/
(c) Hakuhin & 日新礼符 2002-2011 解像度1024×768以上 IE8.0以上推奨		 / 閲覧中:人