HAKUHIN's home page
更新履歴
 
 



ビットマップデータを作り配置する
 


1.ビットマップデータを作成する

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

// BitmapData オブジェクトを作成する
var bmp_data = new flash.display.BitmapData(400, 300, true, 0xFFFFAA88);

幅 300 高さ 300 カラーを 0xFFFFAA88 で初期化してビットマップデータを作成(AS2.0)

import flash.display.BitmapData;

// BitmapData オブジェクトを作成する
var bmp_data:BitmapData = new BitmapData(400, 300, true, 0xFFFFAA88);
 
2.ムービークリップに配置する

ビットマップデータをムービークリップに配置するには、attachBitmap() メソッドを使用します。
 
イメージ自体は「外部から画像ファイルを読み込んだとき」と同じようにムービークリップの原点から動かす事ができません
 
ムービークリップ.attachBitmap ( BitmapData , 深度 , 吸着設定 , スムージング );
第01引数 ビットマップデータ
第02引数 深度
第03引数(略可)ピクセル吸着設定
「回転拡縮時以外常に吸着」"auto"、「常に吸着」"always"、「吸着しない」"never"
第04引数(略可)スケーリングを使用する
戻り値 BitmapData インスタンス
 
使用例です。
 
_root に ビットマップデータを配置(AS1.0)

// ライブラリから BitmapData オブジェクトを作成する
var bmp_data = new flash.display.BitmapData(400, 300, true, 0xFFFFAA88);

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0, "auto", true);

_root に ビットマップデータを配置(AS2.0)

import flash.display.BitmapData;

// ライブラリから BitmapData オブジェクトを作成する
var bmp_data:BitmapData = new BitmapData(400, 300, true, 0xFFFFAA88);

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0, "auto", true);
 




ライブラリの画像からビットマップデータを作成する
 
サンプルをダウンロード
 


1.ライブラリにビットマップを登録する

画像を読み込んでライブラリに登録します。
 
画像を選んで右クリック、リンケージプロパティを選んで好きな識別名を付けます。
 
 
 
識別子に好きな名前を付けます。ここでは、"dat00" と名前を付けます。
 
『ActionScriptに書き出し』と『最初のフレームに書き出し』にチェックを付けます。
 
 
 
この状態でFlashを書き出すと swf ファイルにデータが埋め込まれるようになります。
 
プロファイラ機能を使って確認してみるとタイムラインの1フレーム目にデータが追加されている事がわかります。
 
埋め込む前の状態
 
埋め込んだ後の状態
 
2.ライブラリに登録したビットマップからビットマップデータを作成する

先ほど登録したビットマップを使ってビットマップデータを作成するには、BitmapData.loadBitmap() メソッドを使用します。
 
このメソッドは静的に呼び出します。
 
flash.display.BitmapData.loadBitmap("識別名");
第01引数 識別名
戻り値 ビットマップデータオブジェクト
 
"dat00" を使用して作成する例です。
 
ライブラリにある "dat00" という名前を付けた画像からビットマップデータを作成(AS1.0)

// BitmapData オブジェクトを作成する
var bmp_data = flash.display.BitmapData.loadBitmap("dat00");

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0, "auto", true);

ライブラリにある "dat00" という名前を付けた画像からビットマップデータを作成(AS2.0)

import flash.display.BitmapData;

// BitmapData オブジェクトを作成する
var bmp_data:BitmapData = BitmapData.loadBitmap("dat00");

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0, "auto", true);
 




ビットマップデータのメモリを解放する
 
サンプルをダウンロード
 


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

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

// ライブラリから BitmapData オブジェクトを作成する
var bmp_data = new flash.display.BitmapData(400, 300, true, 0xFFFFAA88);

bmp_data.dispose();

ビットマップデータ bmp_data のメモリを解放する (AS2.0)

import flash.display.BitmapData;

// ライブラリから BitmapData オブジェクトを作成する
var bmp_data:BitmapData = new BitmapData(400, 300, true, 0xFFFFAA88);

bmp_data.dispose();
 




ムービークリップの絵をキャプチャする
 
 
サンプルをダウンロード
 


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

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

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



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



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

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

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

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

 
 
使用例です。
 
_root に描かれた描画結果をビットマップデータにキャプチャーする (AS1.0)

// BitmapData オブジェクトを作成する
var bmp_data = new flash.display.BitmapData(400, 300, true, 0xFFFFAA88);

var m = new flash.geom.Matrix();
var color = new flash.geom.ColorTransform(1, 1, 1, 1, 0, 0, 0, 0);
var rect = new flash.geom.Rectangle(0, 0, 200, 200);

// _root のグラフィックをキャプチャする
bmp_data.draw(_root, m, color, "normal", rect, true);

_root に描かれた描画結果をビットマップデータにキャプチャーする (AS2.0)

import flash.display.BitmapData;
import flash.geom.Matrix;
import flash.geom.ColorTransform;
import flash.geom.Rectangle;

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

var m:Matrix = new flash.geom.Matrix();
var color:ColorTransform = new flash.geom.ColorTransform(1, 1, 1, 1, 0, 0, 0, 0);
var rect:Rectangle = new flash.geom.Rectangle(0, 0, 200, 200);

// _root のグラフィックをキャプチャする
bmp_data.draw(_root, m, color, "normal", rect, true);
 




イメージを転送する
 
 


■クローンを作成する

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

// BitmapData オブジェクトを作成する
var bmp_data = new flash.display.BitmapData(400, 300, true, 0xFFFFAA88);

// BitmapData オブジェクトを複製する
var copy_bmp = bmp_data.clone();

bmp_data を 複製して copy_bmp インスタンスを作成する (AS2.0)

import flash.display.BitmapData;

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

// BitmapData オブジェクトを複製する
var copy_bmp : BitmapData = bmp_data.clone();
 
 

 
■イメージを転送する

 
ビットマップデータのイメージを別のビットマップデータのイメージに高速で転送するには、copyPixels() メソッドを使用します。

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

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

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

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

var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF8000);
var source = new flash.display.BitmapData( 512 , 512 , true , 0xFF0080FF);

var rect = new flash.geom.Rectangle(0,0,256,256);
var pos = new flash.geom.Point(0,0);

bmp_data.copyPixels(source,rect,pos);

source から bmp_data に転送する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


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

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

bmp_data.copyPixels(source,rect,pos);
 
 
アルファ合成を使った使用例です。
 
source1 と source2(透過のみ) を合成してから、 bmp_data に転送する (AS1.0)

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

var rect = new flash.geom.Rectangle(0,0,256,256);
var pos = new flash.geom.Point(0,0);

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

source1 と source2(透過のみ) を合成してから、 bmp_data に転送する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


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:Rectangle = new Rectangle(0,0,256,256);
var pos:Point = new Point(0,0);

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

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

 
赤色、緑色、青色、透過 の4種類のうち、各色の成分1つだけの転送を行うには、copyChannel() メソッドを使用します。

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

数値解説
1赤色チャンネル
2緑色チャンネル
4青色チャンネル
8透過チャンネル
 
使用例です。
 
source の赤色成分を bmp_data の青色成分に転送する (AS1.0)

var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF0000);
var source = new flash.display.BitmapData( 512 , 512 , true , 0xFF880000);

var rect = new flash.geom.Rectangle(0,0,256,256);
var pos = new flash.geom.Point(0,0);

bmp_data.copyChannel(source,rect,pos,1,4);

source の赤色成分を bmp_data の青色成分に転送する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


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

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

bmp_data.copyChannel(source,rect,pos,1,4);
 




イメージのピクセルから色を取得する
 
 
サンプルをダウンロード
 


■24ビットのピクセルカラーを取得する

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

var bmp_data = new flash.display.BitmapData( 400 , 300 , false , 0xFF8822);

var color = bmp_data.getPixel(20,30);
var r = (color >>> 16) & 0xFF;
var g = (color >>>  8) & 0xFF;
var b = (color >>>  0) & 0xFF;

ビットマップデータの横20,縦30の位置にある24ビットピクセルカラーを取得する (AS1.0)

import flash.display.BitmapData;


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

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

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

var bmp_data = new flash.display.BitmapData( 400 , 300 , true , 0xFFCC8822);

var color = bmp_data.getPixel32(20,30);
var a = (color >>> 24) & 0xFF;
var r = (color >>> 16) & 0xFF;
var g = (color >>>  8) & 0xFF;
var b = (color >>>  0) & 0xFF;

ビットマップデータの横20,縦30の位置にある32ビットピクセルカラーを取得する (AS2.0)

import flash.display.BitmapData;


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

var color : Number = bmp_data.getPixel32(20,30);
var a : Number = (color >>> 24) & 0xFF;
var r : Number = (color >>> 16) & 0xFF;
var g : Number = (color >>>  8) & 0xFF;
var b : Number = (color >>>  0) & 0xFF;
 




イメージのピクセルに色を書き込む
 
 
サンプルをダウンロード
 


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

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

var bmp_data = new flash.display.BitmapData( 400 , 300 , false , 0xFFFFFF);

var r = 255;
var g =   0;
var b = 128;

var color = (r << 16) | (g << 8) | (b << 0);

var i;
for(i=0;i < 300;i++){
	bmp_data.setPixel(i,30,color);
}

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);

横 20 ,縦 30 の位置に24ビットピクセルカラーを書き込む (AS2.0)

import flash.display.BitmapData;


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

var r : Number = 255;
var g : Number =   0;
var b : Number = 128;

var color : Number = (r << 16) | (g << 8) | (b << 0);

var i : Number;
for(i=0;i < 300;i++){
	bmp_data.setPixel(i,30,color);
}

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);
 
■該当する座標のピクセルに32ビットのピクセルカラーを書き込む

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

var bmp_data = new flash.display.BitmapData( 400 , 300 , true , 0xFFFFFFFF);

var r = 255;
var g =   0;
var b = 128;
var a = 255;
var color = (a << 24) | (r << 16) | (g << 8) | (b << 0);

var i;
for(i=0;i < 300;i++){
	bmp_data.setPixel32(i,30,color);
}

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);

横 20 ,縦 30 の位置に32ビットピクセルカラーを書き込む (AS2.0)

import flash.display.BitmapData;


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

var r : Number = 255;
var g : Number =   0;
var b : Number = 128;
var a : Number = 255;
var color : Number = (a << 24) | (r << 16) | (g << 8) | (b << 0);

var i : Number;
for(i=0;i < 300;i++){
	bmp_data.setPixel32(i,30,color);
}

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);
 

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

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

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);

矩形領域 ( x=50 , y=50 , w=300 , h=200 ) を 0xFFFF0000 で塗りつぶす (AS2.0)

import flash.display.BitmapData;
import flash.geom.Rectangle;


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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);
 
■連続している同じ色部分を塗りつぶす

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

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);

座標 (100,50 ) から連続している同じ色を 0xFFFF0000 で塗りつぶす (AS2.0)

import flash.display.BitmapData;


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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data,0);
 




イメージをスクロールする
 
 
サンプルをダウンロード
 


■イメージのスクロール

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

var bmp_data = flash.display.BitmapData.loadBitmap("dat00");

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

// 毎フレーム実行されるイベント
onEnterFrame = function() {
	bmp_data.scroll(2,1);
}

x方向に20, y方向に10ピクセルスクロールする (AS2.0)

import flash.display.BitmapData;


var bmp_data : BitmapData = BitmapData.loadBitmap("dat00");

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

// 毎フレーム実行されるイベント
onEnterFrame = function():Void{
	bmp_data.scroll(2,1);
}
 




イメージにノイズを発生
 
 
サンプルをダウンロード
 


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

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

var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF8000);

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

ランダムノイズを表示する (AS2.0)

import flash.display.BitmapData;


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

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);
 




イメージにPerlinノイズを発生させる
 
 
サンプルをダウンロード
 


■イメージに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引数に渡すパラメータ (AS1.0)

var offset = new Array();
offset[0] = new flash.geom.Point(0  , 0);	// 01番目のオフセット
offset[1] = new flash.geom.Point(20 ,20);	// 02番目のオフセット
offset[2] = new flash.geom.Point(50 ,10);	// 03番目のオフセット

第09引数に渡すパラメータ (AS2.0)

import flash.geom.Point;

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

var bmp_data = new flash.display.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));

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

Perlinノイズを表示する (AS2.0)

import flash.display.BitmapData;


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

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);
 
 
スクロールさせる例です。
 
スクロールするPerlinノイズを表示する (AS1.0)

var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF8000);

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

// 毎フレーム実行されるイベント
onEnterFrame = function(){
	offset[0].x += 2;
	offset[1].y += 5;
	bmp_data.perlinNoise(64 ,64 , 2 , rand , false , true , (8|4|2|1) , false , offset);
}

スクロールするPerlinノイズを表示する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;


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

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

// _root にBitmapData オブジェクトを配置
_root.attachBitmap(bmp_data, 0);

// 毎フレーム実行されるイベント
onEnterFrame = function():Void{
	offset[0].x += 2;
	offset[1].y += 5;
	bmp_data.perlinNoise(64 ,64 , 2 , rand , false , true , (8|4|2|1) , false , offset);
}
 




イメージ間をマージでつなぐ
 
 
サンプルをダウンロード
 


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

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

var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF8000);
var source = new flash.display.BitmapData( 512 , 512 , true , 0xFF0080FF);

// ムービークリップに配置
var mc = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

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

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

マージで補間する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


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

// ムービークリップに配置
var mc:MovieClip = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

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

bmp_data.merge(source , rect, pos , 128, 128, 128, 128);
 
徐々に変化させる例です。
 
2つのビットマップイメージソース間をマージで徐々に変化させる (AS1.0)

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

// ムービークリップに配置
var mc = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

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

var d = 0;

// 毎フレーム実行されるイベント
onEnterFrame = function(){
	d += 1;
	if(d > 255)	d = 0;
	bmp_data.copyPixels(source1, rect, pos);
	bmp_data.merge(source2, rect, pos, d, d, d, d);
};

2つのビットマップイメージソース間をマージで徐々に変化させる (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


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 mc:MovieClip = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

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

var d:Number = 0;

// 毎フレーム実行されるイベント
onEnterFrame = function():Void{
	d += 1;
	if(d > 255)	d = 0;
	bmp_data.copyPixels(source1, rect, pos);
	bmp_data.merge(source2, rect, pos, d, d, d, d);
};
 




イメージ間をピクセルディゾルブでつなぐ
 
 
サンプルをダウンロード
 


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

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

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

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

// ビットマップデータを作る
var bmp_data = flash.display.BitmapData.loadBitmap ("dat00");
var source = flash.display.BitmapData.loadBitmap ("dat01");

// ムービークリップに配置
var mc = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

var point = new flash.geom.Point( 0, 0);
var rect = new flash.geom.Rectangle(0, 0, 400, 300);
var rand = Math.floor(Math.random()*10000);

// 毎フレーム実行されるイベント
onEnterFrame = function () {
	rand = bmp_data.pixelDissolve(source, rect, point, rand, 1000, 0x00000000);
}

ピクセルディゾルブで補間する (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


// ビットマップデータを作る
var bmp_data = BitmapData.loadBitmap ("dat00");
var source = BitmapData.loadBitmap ("dat01");

// ムービークリップに配置
var mc = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

var point:Point = new Point( 0, 0);
var rect:Rectangle = new Rectangle(0, 0, 400, 300);
var rand:Number = Math.floor(Math.random()*10000);

// 毎フレーム実行されるイベント
onEnterFrame = function ():Void {
	rand = bmp_data.pixelDissolve(source, rect, point, rand, 1000, 0x00000000);
}
 
 
単一カラーで塗りつぶす例です。
 
ピクセルディゾルブを使って単一カラーで塗りつぶす (AS1.0)

// ビットマップデータを作る
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFF0000);

// ムービークリップに配置
var mc = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data,0);

var rect = new flash.geom.Rectangle(0,0,512,512);
var pos = new flash.geom.Point(0,0);
var rand = Math.floor(Math.random()*10000);;

// 毎フレーム実行されるイベント
onEnterFrame = function (){
	rand = bmp_data.pixelDissolve(bmp_data , rect, pos ,rand , 1000 , 0xFF0000FF);
}

ピクセルディゾルブを使って単一カラーで塗りつぶす (AS2.0)

import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;


// ビットマップデータを作る
var bmp_data : BitmapData = new BitmapData( 512 , 512 , true , 0xFFFF0000);

// ムービークリップに配置
var mc:MovieClip = createEmptyMovieClip("empty", this.getNextHighestDepth());
mc.attachBitmap(bmp_data, 0);

var rect:Rectangle = new Rectangle(0,0,512,512);
var pos:Point = new Point(0,0);
var rand:Number = Math.floor(Math.random()*10000);;

// 毎フレーム実行されるイベント
onEnterFrame = function ():Void{
	rand = bmp_data.pixelDissolve(bmp_data , rect, pos ,rand , 1000 , 0xFF0000FF);
}
 




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