ビットマップデータについて(Flash 8 以降)
・ | BitmapData オブジェクトを作成する |
・ | BitmapData オブジェクトを解放する |
・ | 埋め込んだ画像ファイルを表示する |
・ | 外部から読み込んだ画像ファイルを表示する |
・ | ビットマップにレンダリング(キャプチャ)する |
・ | ビットマップの編集について |
・ | ビットマップの転送について |
・ | ビットマップのエフェクトについて |
BitmapData オブジェクトを作成する
BitmapData オブジェクトを作成する(単一色)
new 演算子を使って、BitmapDeta クラスをインスタンス化します。
単一色で初期化されます。
引数で設定するパラメータは、後から変更できません。
new flash.display.BitmapData( 幅 , 高さ , 32bitカラー? , 初期カラー ) :BitmapData
第01引数 | Number | ビットマップの幅 |
第02引数 | Number | ビットマップの高さ |
第03引数(略可) | Boolean | true の場合、透過ありビットマップ(32bitカラー) false の場合、透過なしビットマップ(24bitカラー) デフォルトは true |
第04引数(略可) | Number | 初期カラーを指定、デフォルトは 0xFFFFFFFF 32bitカラーならARGB値を指定 24bitカラーならRGB値を指定 |
戻り値 | BitmapData | 新しい BitmapData オブジェクトが得られる |
■第04引数(初期カラー)
単一色で塗りつぶす色(ARGB)を指定します。
指定した色が、実際に書き込まれるとは限りません。
アルファ値によって、赤緑青は丸められます。
■ BitmapData オブジェクトの作成例(24bit)
24bitカラーの BitmapData オブジェクトを作成 (AS1.0)
// ------------------------------------------------------------
// 初期化パラメータ
// ------------------------------------------------------------
// ビットマップの幅
var width = 400;
// ビットマップの高さ
var height = 300;
// 単一色で塗りつぶす RGB カラー
var color_rgb = 0xFFCC88;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(24bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( width , height , false , color_rgb );
// ------------------------------------------------------------
// _root に配置する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
24bitカラーの BitmapData オブジェクトを作成 (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// 初期化パラメータ
// ------------------------------------------------------------
// ビットマップの幅
var width:Number = 400;
// ビットマップの高さ
var height:Number = 300;
// 単一色で塗りつぶす RGB カラー
var color_rgb:Number = 0xFFCC88;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(24bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( width , height , false , color_rgb );
// ------------------------------------------------------------
// _root に配置する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■ BitmapData オブジェクトの作成例(32bit)
32bitカラーの BitmapData オブジェクトを作成 (AS1.0)
// ------------------------------------------------------------
// 初期化パラメータ
// ------------------------------------------------------------
// ビットマップの幅
var width = 400;
// ビットマップの高さ
var height = 300;
// 単一色で塗りつぶす ARGB カラー
var color_argb = 0x80FFCC88;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( width , height , true , color_argb );
// ------------------------------------------------------------
// _root に配置する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
32bitカラーの BitmapData オブジェクトを作成 (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// 初期化パラメータ
// ------------------------------------------------------------
// ビットマップの幅
var width:Number = 400;
// ビットマップの高さ
var height:Number = 300;
// 単一色で塗りつぶす ARGB カラー
var color_argb:Number = 0x80FFCC88;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( width , height , true , color_argb );
// ------------------------------------------------------------
// _root に配置する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
利用可能なビットマップのサイズ上限について
■Flash Player 9 以前の場合
幅と高さが 2880 ピクセルまでのビットマップを作成できます。
■Flash Player 10 の場合
幅と高さが 8192 ピクセルまでのビットマップを作成できます。
総ピクセル数は 16777216 までとなります。
(幅が 8192 なら、高さは 2048 まで)
■Flash Player 11 以降の場合
サイズの制限はありません。
実際の限界サイズは、OS ごとに異なります。
BitmapData オブジェクトを表示する
BitmapData オブジェクトをムービークリップに配置する
attachBitmap() メソッドを使用します。
配置したい親ムービークリップから呼び出します。
MovieClip.attachBitmap( BitmapData , 深度 , "PixelSnapping" , スムージング? ) :Void
第01引数 | BitmapData | 配置するビットマップ |
第02引数 | Number | ビットマップの深度 |
第03引数(略可) | String | PixelSnapping の種類を指定、デフォルトは "auto" |
第04引数(略可) | Boolean | スムージングを有効にするなら true を指定、デフォルトは false |
戻り値 | Void | なし |
■第02引数(深度)
深度については、こちらで解説しています。
指定した深度に、すでにインスタンスが存在する場合は、古いインスタンスが消滅します。
■第03引数(PixelSnapping)
PixelSnapping については、こちらで解説しています。
■第04引数(スムージング)
false を指定した場合、ニアレストネイバーで表示されます。
true を指定した場合、バイリニアフィルタで表示されます。
デフォルトは、false です。
false | true |
■ビットマップの配置位置について
ビットマップの左上が、ムービークリップの原点と一致するように配置されます。
ビットマップの位置自体を変更する事はできません。
空のムービークリップに配置するといいでしょう。
ムービークリップを制御して、ビットマップの姿勢を変更します。
■使用例
BitmapData オブジェクトを表示する (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 256 , 128 , true , 0xffcc8800 );
// ------------------------------------------------------------
// 空のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// 空のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// ムービークリップを制御する
// ------------------------------------------------------------
bitmap_obj._x = 100;
bitmap_obj._y = 100;
bitmap_obj._rotation = 30;
BitmapData オブジェクトを表示する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 256 , 128 , true , 0xffcc8800 );
// ------------------------------------------------------------
// 空のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj:MovieClip = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// 空のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// ムービークリップを制御する
// ------------------------------------------------------------
bitmap_obj._x = 100;
bitmap_obj._y = 100;
bitmap_obj._rotation = 30;
PixelSnapping について
PixelSnapping には、以下の種類があります。
デフォルトは、"auto" です。
文字列 | 解説 |
"auto" | PixelSnapping を使用する(傾斜がなく、等倍に極めて近い場合のみ) |
"always" | PixelSnapping を使用する(常に) |
"never" | PixelSnapping を使用しない |
■ PixelSnapping の "auto" モードについて
これは、最終的なモニタスクリーン座標系に対して作用します。
ビットマップが、「約 99.9% ~ 100.1% の拡大率」かつ「傾斜がない」
この条件を満たしている場合、PixelSnapping が発動します。
座標が小数値を含む場合、整数位置に補正されます。
拡大率は、等倍(100%)に補正されます。
これにより、滲むことなく、高速でレンダリングされるようになります。
Dot by Dot と同じです。
BitmapData オブジェクトを解放する
サンプルをダウンロード
■BitmapData オブジェクトを解放する
BitmapData クラスには、メモリ解放用のメソッドが用意されています。
ガベージコレクションでも解放されますが、すぐに実行されるとは限りません。
特に BitmapData オブジェクトは、メモリサイズが巨大になりがちです。
不要になった場合、即解放するように心掛けます。
■BitmapData オブジェクトを解放する
dispose() メソッドを使用します。
高さ 0 幅 0 である、BitmapData オブジェクトに変化します。
BitmapData オブジェクトを再利用する事はできません。
BitmapData.dispose ( ) :Void
引数 | Void | なし |
戻り値 | Void | なし |
■使用例
BitmapData オブジェクトを解放する (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 400 , 300 );
// ------------------------------------------------------------
// BitmapData オブジェクトを解放する
// ------------------------------------------------------------
bmp_data.dispose();
bmp_data = null;
BitmapData オブジェクトを解放する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 400 , 300 );
// ------------------------------------------------------------
// BitmapData オブジェクトを解放する
// ------------------------------------------------------------
bmp_data.dispose();
bmp_data = null;
埋め込んだ画像ファイルを表示する
サンプルをダウンロード
■埋め込んだ画像ファイルを表示する
画像ファイルを、 swf ファイルに埋め込む事ができます。
埋め込んだ画像ファイルは、動的に表示する事ができます。
■画像ファイルを埋め込む(Adobe Flash の場合)
1.リンケージプロパティを開く
ライブラリウィンドウを開きます。
使用したい画像ファイルから、リンケージプロパティを選択します。
2.リンケージ識別子を設定する
リンケージプロパティというダイアログが開きます。
識別子に好きな名称を付けます。
ここでは、"my_bitmap" と名前を付けます。
Flash 5 の場合は、『このシンボルに書き出す』にチェックを付けます。
Flash MX 以降の場合は、『ActionScript に書き出し』と『最初のフレームに書き出し』にチェックを付けます。
3.Flash を書き出して、データの埋め込みを確認する
この状態で、Flash を書き出します。
すると、swf ファイルにデータが埋め込まれるようになります。
プロファイラ機能を使用すると、データが埋め込まれたか確認できます。
タイムラインの1フレーム目のサイズが増えているでしょう。
■画像ファイルを埋め込む(FlashDevelop の場合)
1.プロジェクトに画像ファイルを追加する
プロジェクトウィンドウの、任意のフォルダを選択します。
「Add」→「Library Asset」を選択します。
ファイル選択ダイアログが開くので、画像ファイルを選択します。
2.リンケージ識別子を設定する
追加された画像ファイルを選択して、「Options」を選択します。
「Library Asset Properties」ダイアログが開きます。
「Auto-generate ID ...」のチェックを外して、好きな識別子を付けます。
ここでは、"my_bitmap" と名前を付けます。
「Embed as Bitmap instead of Clip」にチェックを付けます。
3.Flash を書き出して、データの埋め込みを確認する
この状態で、Flash を書き出します。
すると、swf ファイルにデータが埋め込まれるようになります。
swf ファイルのサイズが増えたか、確認します。
■画像ファイルを埋め込む(Parafla の場合)
1.プロジェクトに画像ファイルを追加する
ファイルリストに、画像ファイルを追加します。
「アイテムの追加」→「ファイル」を選択します。
ファイル選択ダイアログが開くので、画像ファイルを選択します。
2.リンケージ識別子を設定する
追加された画像ファイルを選択して、「プロパティ」を選択します。
「ファイルのプロパティ」ダイアログが開きます。
「ビットマップの設定」の「オブジェクト名」に、好きな識別子を付けます。
ここでは、"my_bitmap" と名前を付けます。
3.ダミーの画像イベントを追加する
このままでは、画像ファイルは埋め込まれません。
イベントリストにて、画像を利用する必要があります。(最低でも1回)
レイヤーを作成します。(どこにも配置しないスプライト)
埋め込み用のスプライトを作成します。
レイヤーの1フレーム目に、埋め込み用のスプライトを配置します。
埋め込み用のスプライトに、画像を追加していきます。
埋め込み用のスプライトの1フレーム目に、スクリプトを追加します。
自身のスプライト(MovieClip)を、自殺的に破棄します。
自身のムービークリップを破棄する (Flash7 以降)
// 最前面となる深度に変更する
this.swapDepths(_parent.getNextHighestDepth());
// 自身を破棄する
removeMovieClip(this);
4.Flash を書き出して、データの埋め込みを確認する
この状態で、Flash を書き出します。
すると、swf ファイルにデータが埋め込まれるようになります。
swf ファイルのサイズが増えたか、確認します。
埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する
BitmapData.loadBitmap() メソッドを使用します。
引数に、埋め込んだ画像ファイルの、リンケージ識別子を指定します。
flash.display.BitmapData.loadBitmap ( "リンケージ識別子" ) :BitmapData
第01引数 | String | 埋め込んだ画像ファイルの、リンケージ識別子を指定する |
戻り値 | BitmapData | 新しい BitmapData オブジェクトが得られる |
■使用例
埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (AS1.0)
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap" )
// ------------------------------------------------------------
var bmp_data = flash.display.BitmapData.loadBitmap("my_bitmap");
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// ビットマップ用のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap" )
// ------------------------------------------------------------
var bmp_data:BitmapData = BitmapData.loadBitmap("my_bitmap");
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj:MovieClip = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// ビットマップ用のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
BitmapData オブジェクトを表示する
こちらで解説しています。
ビットマップにレンダリング(キャプチャ)する
サンプルをダウンロード
■ビットマップにレンダリング(キャプチャ)する
draw() メソッドを使用します。
Flash 上のラスターやベクターなどを、BitmapData に描画できます。
描画したい素材を、ソースといいます。
描画先のビットマップを、ターゲットといいます。
ターゲットの、元のイメージは重要です。
新しいレンダリングは、元のイメージに上書き合成されます。
BitmapData.draw( ソース , Matrix , ColorTransform , ブレンドモード , Rectangle , スムージング? ) :Void
第01引数 | * | ソースとなる「別の BitmapData」や「MovieClip などのインスタンス」を指定 |
第02引数(略可) | Matrix | ソースの姿勢を、Matrix 型で指定 |
第03引数(略可) | ColorTransform | ソースのカラー変換を、ColorTransform 型で指定 |
第04引数(略可) | String | ターゲットと新しいソースとの、ブレンドモードを指定 |
第05引数(略可) | Rectangle | ターゲット側の描画範囲を限定したい場合、矩形を Rectangle 型で指定 |
第06引数(略可) | Boolean | スムージングを有効にするなら true を指定、デフォルトは false |
戻り値 | Void | なし |
■第01引数 ソース
描画したいソースを指定します。
「別の BitmapData」や、「MovieClip などのインスタンス」を指定します。
インスタンスを指定した場合、現在の姿勢は考慮されません。
位置、姿勢、カラー、ブレンドなどは無視されます。
■第02引数 ソースの姿勢
ターゲットのビットマップ座標系に、ソースを配置します。
ソースの姿勢を、行列で指定します。
■第03引数 カラートランスフォーム
こちらで解説しています。
■第04引数 ブレンドの種類
■第05引数 ターゲット側の描画範囲
ターゲットの描画範囲を限定したい場合に指定します。
null を指定した場合、ターゲット全体が描画対象となります。
■第06引数(スムージング)
ソースが、BitmapData である場合に、効果があります。
false を指定した場合、ニアレストネイバーで描画されます。
true を指定した場合、バイリニアフィルタで描画されます。
デフォルトは、false です。
false | true |
■ビットマップに Flash 全体を描画する例
ビットマップに、_root をレンダリングする (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFF00FF00 );
// ------------------------------------------------------------
// ビットマップに描画する(ソースは Flash 全体)
// ------------------------------------------------------------
bmp_data.draw( _root );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
ビットマップに、_root をレンダリングする (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xFF00FF00 );
// ------------------------------------------------------------
// ビットマップに描画する(ソースは Flash 全体)
// ------------------------------------------------------------
bmp_data.draw( _root );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■ビットマップにムービークリップを描画する例
ビットマップにムービークリップを描画する (AS1.0)
// ------------------------------------------------------------
// ソース用のムービークリップを作成
// ------------------------------------------------------------
var shape = (function(){
// ------------------------------------------------------------
// 空のムービークリップを作成して配置する
// ------------------------------------------------------------
var mc = _root.createEmptyMovieClip( "shape" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// 矩形を描画
// ------------------------------------------------------------
var mtx = new flash.geom.Matrix(320/1638.4,0,0,1,160,0);
mc.lineStyle (5, 0x505050, 100);
mc.beginGradientFill ( "linear" , [0xFF8080,0x8080FF] , [255,255] , [0,255] , mtx);
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 240 );
mc.lineTo ( 320 , 240 );
mc.lineTo ( 320 , 0 );
mc.endFill();
// ------------------------------------------------------------
// 非表示に設定
// ------------------------------------------------------------
mc._visible = false;
return mc;
}).call();
// ------------------------------------------------------------
// BitmapData オブジェクト
// ------------------------------------------------------------
var bmp_data = (function(){
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0x20000000 );
// ------------------------------------------------------------
// ソースの姿勢
// ------------------------------------------------------------
// 行列を作成(単位行列)
var mtx = new flash.geom.Matrix();
// 移動成分を乗算
mtx.translate(20 , 20);
// ------------------------------------------------------------
// ソースのカラートランスフォーム
// ------------------------------------------------------------
var color_transform = new flash.geom.ColorTransform();
// ------------------------------------------------------------
// ターゲット側の描画範囲
// ------------------------------------------------------------
var target_clip = new flash.geom.Rectangle(0 , 0 , 512 , 512);
// ------------------------------------------------------------
// ビットマップに描画する(ソースはムービークリップ)
// ------------------------------------------------------------
bmp_data.draw( shape , mtx , color_transform , "normal" , target_clip );
return bmp_data;
}).call();
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// ビットマップ用のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
ビットマップにムービークリップを描画する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Matrix;
import flash.geom.ColorTransform;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ソース用のムービークリップを作成
// ------------------------------------------------------------
var shape:MovieClip = (function():MovieClip{
// ------------------------------------------------------------
// 空のムービークリップを作成して配置する
// ------------------------------------------------------------
var mc:MovieClip = _root.createEmptyMovieClip( "shape" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// 矩形を描画
// ------------------------------------------------------------
var mtx:Matrix = new Matrix(320/1638.4,0,0,1,160,0);
mc.lineStyle (5, 0x505050, 100);
mc.beginGradientFill ( "linear" , [0xFF8080,0x8080FF] , [255,255] , [0,255] , mtx);
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 240 );
mc.lineTo ( 320 , 240 );
mc.lineTo ( 320 , 0 );
mc.endFill();
// ------------------------------------------------------------
// 非表示に設定
// ------------------------------------------------------------
mc._visible = false;
return mc;
}).call();
// ------------------------------------------------------------
// BitmapData オブジェクト
// ------------------------------------------------------------
var bmp_data:BitmapData = (function():BitmapData{
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0x20000000 );
// ------------------------------------------------------------
// ソースの姿勢
// ------------------------------------------------------------
// 行列を作成(単位行列)
var mtx:Matrix = new Matrix();
// 移動成分を乗算
mtx.translate(20 , 20);
// ------------------------------------------------------------
// ソースのカラートランスフォーム
// ------------------------------------------------------------
var color_transform:ColorTransform = new ColorTransform();
// ------------------------------------------------------------
// ターゲット側の描画範囲
// ------------------------------------------------------------
var target_clip:Rectangle = new Rectangle(0 , 0 , 512 , 512);
// ------------------------------------------------------------
// ビットマップに描画する(ソースはムービークリップ)
// ------------------------------------------------------------
bmp_data.draw( shape , mtx , color_transform , "normal" , target_clip );
return bmp_data;
}).call();
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj:MovieClip = _root.createEmptyMovieClip( "bitmap_obj" , _root.getNextHighestDepth() );
// ------------------------------------------------------------
// ビットマップ用のムービークリップに BitmapData を配置する
// ------------------------------------------------------------
bitmap_obj.attachBitmap( bmp_data , 0 );
■キャプチャー関連のセキュリティについて
キャプチャー処理には、セキュリティ上の制限があります。
■クロスドメインポリシーの制限について
別ドメインに格納されている、画像や動画などのメディアファイルを、読み込んで表示している場合、それらをキャプチャーすることはできません。
■クロスドメインポリシーの解除について
クロスドメインポリシーは、解除できます。
こちらで解説しています。
ビットマップの編集について
■ビットマップからピクセルカラーを取得する
■ RGB カラー(24bit)を取得する
getPixel() メソッドを使用します。
BitmapData.getPixel( x , y ) :Number
第01引数 | Number | 水平方向のピクセル位置(小数の指定は不可) |
第02引数 | Number | 垂直方向のピクセル位置(小数の指定は不可) |
戻り値 | Number | RGB カラー値が得られる |
■ ARGB カラー(32bit)を取得する
getPixel32() メソッドを使用します。
BitmapData.getPixel32( x , y ) :Number
第01引数 | Number | 水平方向のピクセル位置(小数の指定は不可) |
第02引数 | Number | 垂直方向のピクセル位置(小数の指定は不可) |
戻り値 | Number | ARGB カラー値が得られる |
■使用例
ピクセルカラーを取得する (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFFFFFF );
// ------------------------------------------------------------
// RGB カラー(24bit)を取得する
// ------------------------------------------------------------
var color_rgb0 = bmp_data.getPixel( 0 , 0 );
var color_rgb1 = bmp_data.getPixel( 1 , 5 );
var color_rgb2 = bmp_data.getPixel( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を取得する
// ------------------------------------------------------------
var color_argb0 = bmp_data.getPixel32( 0 , 0 );
var color_argb1 = bmp_data.getPixel32( 1 , 5 );
var color_argb2 = bmp_data.getPixel32( 20 , 10 );
// ------------------------------------------------------------
// 各カラー成分を取得
// ------------------------------------------------------------
var a = (color_argb0 >>> 24) & 0xff;
var r = (color_argb0 >>> 16) & 0xff;
var g = (color_argb0 >>> 8) & 0xff;
var b = (color_argb0 >>> 0) & 0xff;
ピクセルカラーを取得する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xFFFFFFFF );
// ------------------------------------------------------------
// RGB カラー(24bit)を取得する
// ------------------------------------------------------------
var color_rgb0:Number = bmp_data.getPixel( 0 , 0 );
var color_rgb1:Number = bmp_data.getPixel( 1 , 5 );
var color_rgb2:Number = bmp_data.getPixel( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を取得する
// ------------------------------------------------------------
var color_argb0:Number = bmp_data.getPixel32( 0 , 0 );
var color_argb1:Number = bmp_data.getPixel32( 1 , 5 );
var color_argb2:Number = bmp_data.getPixel32( 20 , 10 );
// ------------------------------------------------------------
// 各カラー成分を取得
// ------------------------------------------------------------
var a:Number = (color_argb0 >>> 24) & 0xff;
var r:Number = (color_argb0 >>> 16) & 0xff;
var g:Number = (color_argb0 >>> 8) & 0xff;
var b:Number = (color_argb0 >>> 0) & 0xff;
■ビットマップにピクセルカラーを書き込む
■ RGB カラー(24bit)を書き込む
setPixel() メソッドを使用します。
指定ピクセルに、アルファ成分がある場合、そのまま残ります。
指定した色が、実際に書き込まれるとは限りません。
アルファ値によって、赤緑青は丸められます。
BitmapData.setPixel( x , y , color ) :Void
第01引数 | Number | 水平方向のピクセル位置(小数の指定は不可) |
第02引数 | Number | 垂直方向のピクセル位置(小数の指定は不可) |
第03引数 | Number | RGB カラー値を指定する |
戻り値 | Void | なし |
■ ARGB カラー(32bit)を書き込む
setPixel32() メソッドを使用します。
指定した色が、実際に書き込まれるとは限りません。
アルファ値によって、赤緑青は丸められます。
BitmapData.setPixel32( x , y , color ) :Void
第01引数 | Number | 水平方向のピクセル位置(小数の指定は不可) |
第02引数 | Number | 垂直方向のピクセル位置(小数の指定は不可) |
第03引数 | Number | ARGB カラー値を指定する |
戻り値 | Void | なし |
■使用例
ピクセルカラーを書き込む (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFFFFFFF );
// ------------------------------------------------------------
// RGB カラー(24bit)を書き込む
// ------------------------------------------------------------
bmp_data.setPixel( 0 , 0 , 0x001122 );
bmp_data.setPixel( 1 , 5 , 0xaabbcc );
bmp_data.setPixel( 20 , 10 , 0xff8800 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を書き込む
// ------------------------------------------------------------
bmp_data.setPixel32( 0 , 0 , 0xff001122 );
bmp_data.setPixel32( 1 , 5 , 0xffaabbcc );
bmp_data.setPixel32( 20 , 10 , 0x20ff8800 );
// ------------------------------------------------------------
// RGB カラー(24bit)を取得する
// ------------------------------------------------------------
var color_rgb0 = bmp_data.getPixel( 0 , 0 );
var color_rgb1 = bmp_data.getPixel( 1 , 5 );
var color_rgb2 = bmp_data.getPixel( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を取得する
// ------------------------------------------------------------
var color_argb0 = bmp_data.getPixel32( 0 , 0 );
var color_argb1 = bmp_data.getPixel32( 1 , 5 );
var color_argb2 = bmp_data.getPixel32( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラーをトレースする関数
// ------------------------------------------------------------
function traceColor (color){
var f = function (v){
if(v < 0x10){ return ("0" + v.toString(16)); }
return v.toString(16);
};
var a = (color >>> 24) & 0xff;
var r = (color >>> 16) & 0xff;
var g = (color >>> 8) & 0xff;
var b = (color >>> 0) & 0xff;
trace("A:" + a + " R:" + r + " G:" + g + " B:" + b + " (" + f(a) + f(r) + f(g) + f(b) + ")");
}
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
traceColor(color_rgb0);
traceColor(color_rgb1);
traceColor(color_rgb2);
traceColor(color_argb0);
traceColor(color_argb1);
traceColor(color_argb2);
ピクセルカラーを書き込む (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xFFFFFFFF );
// ------------------------------------------------------------
// RGB カラー(24bit)を書き込む
// ------------------------------------------------------------
bmp_data.setPixel( 0 , 0 , 0x001122 );
bmp_data.setPixel( 1 , 5 , 0xaabbcc );
bmp_data.setPixel( 20 , 10 , 0xff8800 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を書き込む
// ------------------------------------------------------------
bmp_data.setPixel32( 0 , 0 , 0xff001122 );
bmp_data.setPixel32( 1 , 5 , 0xffaabbcc );
bmp_data.setPixel32( 20 , 10 , 0x20ff8800 );
// ------------------------------------------------------------
// RGB カラー(24bit)を取得する
// ------------------------------------------------------------
var color_rgb0:Number = bmp_data.getPixel( 0 , 0 );
var color_rgb1:Number = bmp_data.getPixel( 1 , 5 );
var color_rgb2:Number = bmp_data.getPixel( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラー(32bit)を取得する
// ------------------------------------------------------------
var color_argb0:Number = bmp_data.getPixel32( 0 , 0 );
var color_argb1:Number = bmp_data.getPixel32( 1 , 5 );
var color_argb2:Number = bmp_data.getPixel32( 20 , 10 );
// ------------------------------------------------------------
// ARGB カラーをトレースする関数
// ------------------------------------------------------------
function traceColor (color:Number):Void{
var f:Function = function (v:Number):String{
if(v < 0x10){ return ("0" + v.toString(16)); }
return v.toString(16);
};
var a:Number = (color >>> 24) & 0xff;
var r:Number = (color >>> 16) & 0xff;
var g:Number = (color >>> 8) & 0xff;
var b:Number = (color >>> 0) & 0xff;
trace("A:" + a + " R:" + r + " G:" + g + " B:" + b + " (" + f(a) + f(r) + f(g) + f(b) + ")");
}
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
traceColor(color_rgb0);
traceColor(color_rgb1);
traceColor(color_rgb2);
traceColor(color_argb0);
traceColor(color_argb1);
traceColor(color_argb2);
■ビットマップを塗りつぶす(矩形指定)
fillRect() メソッドを使用します。
指定した色が、実際に書き込まれるとは限りません。
アルファ値によって、赤緑青は丸められます。
BitmapData.fillRect( 矩形 , color ) :Void
第01引数 | Rectangle | 描画する矩形範囲を指定(小数の指定は不可) |
第02引数 | Number | ARGB カラー値を指定する |
戻り値 | Void | なし |
■使用例
矩形指定で、ビットマップを塗りつぶす (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFE0E0FF );
// ------------------------------------------------------------
// 各カラーを用意
// ------------------------------------------------------------
var a = 255;
var r = 255;
var g = 192;
var b = 128;
// ------------------------------------------------------------
// 各カラーから ARGB 値を計算
// ------------------------------------------------------------
var color_argb = (a << 24) | (r << 16) | (g << 8) | (b << 0);
// ------------------------------------------------------------
// Rectangle オブジェクトを作成
// ------------------------------------------------------------
var rect = new flash.geom.Rectangle( 10 , 10 , 200 , 100 );
// ------------------------------------------------------------
// ビットマップを塗りつぶす(矩形指定)
// ------------------------------------------------------------
bmp_data.fillRect( rect , color_argb );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
矩形指定で、ビットマップを塗りつぶす (AS2.0)
import flash.display.BitmapData;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xFFE0E0FF );
// ------------------------------------------------------------
// 各カラーを用意
// ------------------------------------------------------------
var a:Number = 255;
var r:Number = 255;
var g:Number = 192;
var b:Number = 128;
// ------------------------------------------------------------
// 各カラーから ARGB 値を計算
// ------------------------------------------------------------
var color_argb:Number = (a << 24) | (r << 16) | (g << 8) | (b << 0);
// ------------------------------------------------------------
// Rectangle オブジェクトを作成
// ------------------------------------------------------------
var rect:Rectangle = new Rectangle( 10 , 10 , 200 , 100 );
// ------------------------------------------------------------
// ビットマップを塗りつぶす(矩形指定)
// ------------------------------------------------------------
bmp_data.fillRect( rect , color_argb );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■ビットマップを塗りつぶす(塗りつぶしツール方式)
floodFill() メソッドを使用します。
指定した色が、実際に書き込まれるとは限りません。
アルファ値によって、赤緑青は丸められます。
BitmapData.floodFill( x , y , color ) :Void
第01引数 | Number | 水平方向のピクセル位置(小数の指定は不可) |
第02引数 | Number | 垂直方向のピクセル位置(小数の指定は不可) |
第03引数 | Number | ARGB カラー値を指定する |
戻り値 | Void | なし |
■使用例
ビットマップを、塗りつぶしツール方式で塗りつぶす (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xFFE0E0FF );
// ------------------------------------------------------------
// 各カラーを用意
// ------------------------------------------------------------
var a = 255;
var r = 255;
var g = 192;
var b = 128;
// ------------------------------------------------------------
// 各カラーから ARGB 値を計算
// ------------------------------------------------------------
var color_argb = (a << 24) | (r << 16) | (g << 8) | (b << 0);
// ------------------------------------------------------------
// ビットマップを塗りつぶす(塗りつぶしツール方式)
// ------------------------------------------------------------
bmp_data.floodFill( 1 , 1 , color_argb );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
ビットマップを、塗りつぶしツール方式で塗りつぶす (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xFFE0E0FF );
// ------------------------------------------------------------
// 各カラーを用意
// ------------------------------------------------------------
var a:Number = 255;
var r:Number = 255;
var g:Number = 192;
var b:Number = 128;
// ------------------------------------------------------------
// 各カラーから ARGB 値を計算
// ------------------------------------------------------------
var color_argb:Number = (a << 24) | (r << 16) | (g << 8) | (b << 0);
// ------------------------------------------------------------
// ビットマップを塗りつぶす(塗りつぶしツール方式)
// ------------------------------------------------------------
bmp_data.floodFill( 1 , 1 , color_argb );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■指定カラーをすべて含む、矩形サイズを取得する
getColorBoundsRect() メソッドを使用します。
BitmapData.getColorBoundsRect( mask , color , findColor ) :Rectangle
第01引数 | Number | マスク値を指定(すべてのピクセルカラーと論理積される) |
第02引数 | Number | ARGB カラーを指定 |
第03引数(略可) | Boolean | true の場合「指定カラー」をすべて検索(デフォルト) false の場合「指定カラー以外」をすべて検索 |
戻り値 | Rectangle | なし |
■第01引数 (マスク)
ここで指定した値は、すべてのピクセルカラーと論理積されます。
ARGB カラーのうち、無視したい領域のビットを 0 とします。
例えば、すべてのカラーを考慮したい場合、0xFFFFFFFF を指定します。
例えば、(透過,緑)のみを考慮したい場合、0xFF00FF00 を指定します。
透過成分のマスクは機能しない?ようです。 0xFF000000 は必ず指定します。
■第02引数 (ARGB カラー)
ARGB カラーを指定します。
第01引数で 0 を指定したビット位置は、第02引数でも 0 で埋めます。
指定した色で、実際に検索されるとは限りません。
アルファ値によって、赤緑青は丸められます。
■第03引数(findColor)
「(ピクセルカラー) & (第01引数)」と「第02引数」が等しいか、比較されます。
true で、「条件を満たすピクセル」をすべて検索します。
false で、「条件を満みたさないピクセル」をすべて検索します。
デフォルトは、true です。
■使用例
指定カラーをすべて含む、矩形サイズを取得する (AS1.0)
// ------------------------------------------------------------
// ARGB 値を用意
// ------------------------------------------------------------
var color_argb0 = 0xFF998877;
var color_argb1 = 0xff112233;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , color_argb0 );
// ------------------------------------------------------------
// 適当な位置にピクセルカラーを書き込む
// ------------------------------------------------------------
bmp_data.setPixel32( 40 , 150 , color_argb1 );
bmp_data.setPixel32( 200 , 60 , color_argb1 );
bmp_data.setPixel32( 420 , 220 , color_argb1 );
// ------------------------------------------------------------
// マスクを用意(ここでは青色成分を無視)
// ------------------------------------------------------------
var mask = 0xFFFFFF00;
// ------------------------------------------------------------
// 「指定カラー」をすべて含む、矩形サイズを取得する
// ------------------------------------------------------------
var rect0 = bmp_data.getColorBoundsRect( mask , (color_argb1 & mask) );
// 出力テスト
trace(rect0); // x:40 , y:60 , w:381 , h:161
// ------------------------------------------------------------
// 「指定カラー以外」をすべて含む、矩形サイズを取得する
// ------------------------------------------------------------
var rect1 = bmp_data.getColorBoundsRect( mask , (color_argb0 & mask) , false );
// 出力テスト
trace(rect1); // x:40 , y:60 , w:381 , h:161
指定カラーをすべて含む、矩形サイズを取得する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ARGB 値を用意
// ------------------------------------------------------------
var color_argb0:Number = 0xFF998877;
var color_argb1:Number = 0xff112233;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new flash.display.BitmapData( 512 , 512 , true , color_argb0 );
// ------------------------------------------------------------
// 適当な位置にピクセルカラーを書き込む
// ------------------------------------------------------------
bmp_data.setPixel32( 40 , 150 , color_argb1 );
bmp_data.setPixel32( 200 , 60 , color_argb1 );
bmp_data.setPixel32( 420 , 220 , color_argb1 );
// ------------------------------------------------------------
// マスクを用意(ここでは青色成分を無視)
// ------------------------------------------------------------
var mask:Number = 0xFFFFFF00;
// ------------------------------------------------------------
// 「指定カラー」をすべて含む、矩形サイズを取得する
// ------------------------------------------------------------
var rect0:Rectangle = bmp_data.getColorBoundsRect( mask , (color_argb1 & mask) );
// 出力テスト
trace(rect0); // x:40 , y:60 , w:381 , h:161
// ------------------------------------------------------------
// 「指定カラー以外」をすべて含む、矩形サイズを取得する
// ------------------------------------------------------------
var rect1:Rectangle = bmp_data.getColorBoundsRect( mask , (color_argb0 & mask) , false );
// 出力テスト
trace(rect1); // x:40 , y:60 , w:381 , h:161
■ビットマップとの当たり判定について
■ビットマップとの当たり判定
hitTest() メソッドを使用します。
BitmapData.hitTest( firstPoint , firstAlphaThreshold , secondObject , secondBitmapPoint , secondAlphaThreshold ) :Boolean
第01引数 | Point | 自身のビットマップの位置を指定 |
第02引数 | Number | 自身のビットマップにて、有とみなす透過成分のしきい値を指定(0 ~ 255) |
第03引数 | * | 相手のソースを指定。Point、Rectangle、BitmapData 型の指定が可能 |
第04引数(略可) | Point | 相手のビットマップの位置を指定 |
第05引数(略可) | Number | 相手のビットマップにて、有とみなす透過成分のしきい値を指定(0 ~ 255) |
戻り値 | Boolean | 当たっていれば true、当たっていなければ false が得られる |
■第01引数 (自身のビットマップの位置)
自身のビットマップの位置を、Point 型で指定します。
当たり判定を調べる為の、仮想的な座標系に配置されます。
■第03引数(相手のソース)
相手のソースを指定します。
座標との当たり判定を調べるには、Point 型を指定します。
矩形との当たり判定を調べるには、Rectangle 型を指定します。
ビットマップとの当たり判定を調べるには、BitmapData 型を指定します。
この場合、第04~05引数も設定します。
■第04引数 (相手のビットマップの位置)
相手のビットマップの位置を、Point 型で指定します。
第03引数に、BitmapData 型を指定した場合に効果があります。
■使用例
2つのビットマップの当たり判定を調べる (AS1.0)
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap0" )
// ------------------------------------------------------------
var bmp_data = flash.display.BitmapData.loadBitmap("my_bitmap0");
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap1" )
// ------------------------------------------------------------
var second_obj = flash.display.BitmapData.loadBitmap("my_bitmap1");
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj0 = _root.createEmptyMovieClip( "bitmap_obj0" , _root.getNextHighestDepth() );
var bitmap_obj1 = _root.createEmptyMovieClip( "bitmap_obj1" , _root.getNextHighestDepth() );
bitmap_obj0.attachBitmap( bmp_data , 0 );
bitmap_obj1.attachBitmap( second_obj , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function (){
// ------------------------------------------------------------
// 当たり判定用パラメータ
// ------------------------------------------------------------
// 自身のビットマップの位置
var first_pos = new flash.geom.Point( 200 , 200 );
// 相手のビットマップの位置
var second_pos = new flash.geom.Point( _root._xmouse , _root._ymouse );
// ------------------------------------------------------------
// 2つのビットマップの当たり判定を調べる
// ------------------------------------------------------------
var result = bmp_data.hitTest( first_pos , 255 , second_obj , second_pos , 255 );
if(result){
trace("当たりあり");
}else{
trace("当たりなし");
}
// ------------------------------------------------------------
// ムービークリップを移動
// ------------------------------------------------------------
bitmap_obj0._x = first_pos.x;
bitmap_obj0._y = first_pos.y;
bitmap_obj1._x = second_pos.x;
bitmap_obj1._y = second_pos.y;
};
2つのビットマップの当たり判定を調べる (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap0" )
// ------------------------------------------------------------
var bmp_data:BitmapData = BitmapData.loadBitmap("my_bitmap0");
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap1" )
// ------------------------------------------------------------
var second_obj:BitmapData = BitmapData.loadBitmap("my_bitmap1");
// ------------------------------------------------------------
// ビットマップ用のムービークリップを作成
// ------------------------------------------------------------
var bitmap_obj0:MovieClip = _root.createEmptyMovieClip( "bitmap_obj0" , _root.getNextHighestDepth() );
var bitmap_obj1:MovieClip = _root.createEmptyMovieClip( "bitmap_obj1" , _root.getNextHighestDepth() );
bitmap_obj0.attachBitmap( bmp_data , 0 );
bitmap_obj1.attachBitmap( second_obj , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function ():Void{
// ------------------------------------------------------------
// 当たり判定用パラメータ
// ------------------------------------------------------------
// 自身のビットマップの位置
var first_pos:Point = new Point( 200 , 200 );
// 相手のビットマップの位置
var second_pos:Point = new Point( _root._xmouse , _root._ymouse );
// ------------------------------------------------------------
// 2つのビットマップの当たり判定を調べる
// ------------------------------------------------------------
var result:Boolean = bmp_data.hitTest( first_pos , 255 , second_obj , second_pos , 255 );
if(result){
trace("当たりあり");
}else{
trace("当たりなし");
}
// ------------------------------------------------------------
// ムービークリップを移動
// ------------------------------------------------------------
bitmap_obj0._x = first_pos.x;
bitmap_obj0._y = first_pos.y;
bitmap_obj1._x = second_pos.x;
bitmap_obj1._y = second_pos.y;
};
■ピクセルカラーの品質について
ピクセルカラーが正確である場合
アルファ成分が、255 (0xff) である場合、残りの赤緑青は、正確です。
ピクセルカラーが正確ではない場合
アルファ成分が、255 (0xff) ではない場合、残りの赤緑青は、不正確です。
埋め込み画像に透明な部分が存在する場合、そのピクセルカラーは不正確です。
書き込んだピクセルが透明である場合、実際に設定されるカラーは不正確です。
copyChannel() メソッドなどを使っても、回避できないようです。
アルファ成分と指定色の関係
アルファ値によって、残りの赤緑青は、丸められます。
アルファ値が 0 に近いほど、大きく変化します。
例えば、アルファ値が 8 だった場合、9 段階の近似値となります。
0 , 32 , 64 , 96 , 127 , 159 , 191 , 223 , 255
例えば、アルファ値が 4 だった場合、5 段階の近似値となります。
0 , 64 , 127 , 191 , 255
丸めの近似式は、以下の通りです。
丸めの近似式
if( (アルファ値) == 0 ){
(書込色) = 0;
}else{
var g = 255 / (アルファ値);
(書込色) = Math.round((指定色) / g) * g;
}
ビットマップの転送について
BitmapData オブジェクトを複製する
clone() メソッドを使用します。
BitmapData.clone ( ) :BitmapData
引数 | Void | なし |
戻り値 | BitmapData | 新しい BitmapData オブジェクトが得られる |
■使用例
BitmapData オブジェクトを複製する (AS1.0)
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 256 , 256 , true , 0xffcc8800 );
// ------------------------------------------------------------
// BitmapData オブジェクトを複製する
// ------------------------------------------------------------
var bmp_data_clone = bmp_data.clone();
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data_clone , 0 );
BitmapData オブジェクトを複製する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 256 , 256 , true , 0xffcc8800 );
// ------------------------------------------------------------
// BitmapData オブジェクトを複製する
// ------------------------------------------------------------
var bmp_data_clone:BitmapData = bmp_data.clone();
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data_clone , 0 );
イメージを高速コピーする(ピクセルカラー)
copyPixels() メソッドを使用します。
コピー元の素材を、ソースといいます。
実際に書き込まれるコピー先を、ターゲットといいます。
BitmapData.copyPixels( ソース , ソース矩形 , ターゲット側の座標 , アルファソース , アルファソース座標 , アルファブレンド? ) :Void
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数(略可) | BitmapData | 2枚目のソースを指定、アルファ成分のみ作用する(第01ソースと乗算される) |
第05引数(略可) | Point | 2枚目のソースの矩形範囲を、Point 型で指定(幅と高さは第02引数を継承) |
第06引数(略可) | Boolean | true なら元の絵とアルファブレンド、false なら単純に書き潰し、デフォルトは false |
戻り値 | Void | なし |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
「ターゲット」と「ソース」に、同一の BitmapData 指定も可能です。
■第02引数 (ソース側の矩形範囲)
ソース側の矩形範囲を、Rectangle 型で指定します。
この幅と高さは、第05引数にも作用します。
■第04引数 (アルファソース)
2枚目のソースとなる、BitmapData オブジェクトを指定します。
アルファ成分のみが使用されます。
「第01ソース」と「アルファソース」は、乗算されます。
結果は、「新しいソース」となります。
第01ソース | 第02ソース | 結果ソース |
null を指定して、省略する事もできます。
第01ソース | 第02ソース | 結果ソース |
■第06引数 アルファブレンド
true を指定した場合、元の絵をソースと合成します。
「ターゲット」と「ソース」とで、アルファブレンドします。
false を指定した場合、ソースで単純に書き潰します。
ターゲットの元の絵は、考慮されず、消滅します。
デフォルトは、false です。
ターゲットが、透過なし(24bit)である場合、必ず true で動作します。
■単純な書き潰し例
ピクセルカラーを高速コピーする (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xffe0e0e0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 256 , 256 , true , 0xffcc8800 );
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = new flash.geom.Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos = new flash.geom.Point( 20 , 20 );
// ------------------------------------------------------------
// ピクセルカラーを高速コピーする
// ------------------------------------------------------------
bmp_data.copyPixels( source , source_rect , target_pos );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
ピクセルカラーを高速コピーする (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xffe0e0e0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 256 , 256 , true , 0xffcc8800 );
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = new Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos:Point = new Point( 20 , 20 );
// ------------------------------------------------------------
// ピクセルカラーを高速コピーする
// ------------------------------------------------------------
bmp_data.copyPixels( source , source_rect , target_pos );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■アルファソース付きの使用例
ソースとアルファソースを指定して、ピクセルカラーを高速コピーする (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xffc0c0ff );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source0 = new flash.display.BitmapData( 256 , 256 , true , 0xffaa6600 );
// ------------------------------------------------------------
// アルファソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source1 = (function(){
// 空のムービークリップを作成
var mc = _root.createEmptyMovieClip( "empty" , _root.getNextHighestDepth() );
// ムービークリップに矩形を描画
var mtx = new flash.geom.Matrix(256/1638.4,0,0,1,128,0);
mc.beginGradientFill ( "linear" , [0x000000,0x000000] , [0,255] , [0,255] , mtx );
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 256 );
mc.lineTo ( 256 , 256 );
mc.lineTo ( 256 , 0 );
mc.endFill();
// BitmapData オブジェクトを作成する(32bit)
var bmp_data1 = new flash.display.BitmapData( 256 , 256 , true , 0x00000000 );
// ビットマップにムービークリップを描画
bmp_data1.draw(mc);
// ムービークリップを破棄
mc.removeMovieClip();
return bmp_data1;
}).call();
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = new flash.geom.Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos = new flash.geom.Point( 20 , 20 );
// アルファソースの位置
var alpha_pos = new flash.geom.Point( 0 , 0 );
// ------------------------------------------------------------
// ピクセルカラーを高速コピーする
// ------------------------------------------------------------
bmp_data.copyPixels( source0 , source_rect , target_pos , source1 , alpha_pos , true );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
ソースとアルファソースを指定して、ピクセルカラーを高速コピーする (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.geom.Matrix;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xffc0c0ff );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source0:BitmapData = new BitmapData( 256 , 256 , true , 0xffaa6600 );
// ------------------------------------------------------------
// アルファソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source1:BitmapData = (function():BitmapData{
// 空のムービークリップを作成
var mc:MovieClip = _root.createEmptyMovieClip( "empty" , _root.getNextHighestDepth() );
// ムービークリップに矩形を描画
var mtx:Matrix = new Matrix(256/1638.4,0,0,1,128,0);
mc.beginGradientFill ( "linear" , [0x000000,0x000000] , [0,255] , [0,255] , mtx );
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 256 );
mc.lineTo ( 256 , 256 );
mc.lineTo ( 256 , 0 );
mc.endFill();
// BitmapData オブジェクトを作成する(32bit)
var bmp_data1:BitmapData = new BitmapData( 256 , 256 , true , 0x00000000 );
// ビットマップにムービークリップを描画
bmp_data1.draw(mc);
// ムービークリップを破棄
mc.removeMovieClip();
return bmp_data1;
}).call();
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = new Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos:Point = new Point( 20 , 20 );
// アルファソースの位置
var alpha_pos:Point = new Point( 0 , 0 );
// ------------------------------------------------------------
// ピクセルカラーを高速コピーする
// ------------------------------------------------------------
bmp_data.copyPixels( source0 , source_rect , target_pos , source1 , alpha_pos , true );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
イメージを高速コピーする(カラーチャンネル単位)
copyChannel() メソッドを使用します。
コピー元の素材を、ソースといいます。
実際に書き込まれるコピー先を、ターゲットといいます。
BitmapData.copyChannel( ソース , ソース矩形 , ターゲット側の座標 , ソース側カラーチャンネル , ターゲット側カラーチャンネル ) :Void
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数 | Number | ソース側のカラーチャンネルを指定(1:赤 2:緑 4:青 8:透過) |
第05引数 | Number | ターゲット側のカラーチャンネルを指定(1:赤 2:緑 4:青 8:透過) |
戻り値 | Void | なし |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
「ターゲット」と「ソース」に、同一の BitmapData 指定も可能です。
■第04引数 (ソース側カラーチャンネル)
ソース側のカラーチャンネルを指定します。
数値 | 解説 |
1 | 赤色チャンネル |
2 | 緑色チャンネル |
4 | 青色チャンネル |
8 | 透過チャンネル |
■第05引数 (ターゲット側カラーチャンネル)
ターゲット側のカラーチャンネルを指定します。
数値 | 解説 |
1 | 赤色チャンネル |
2 | 緑色チャンネル |
4 | 青色チャンネル |
8 | 透過チャンネル |
指定したカラーチャンネルだけが変化するとは限りません。
アルファ値によって、赤緑青は丸められます。
■使用例
カラーチャンネル単位で高速コピーする (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xffe0e0e0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 256 , 256 , true , 0xffef8912 );
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = new flash.geom.Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos = new flash.geom.Point( 20 , 20 );
// ------------------------------------------------------------
// カラーチャンネル単位で高速コピーする
// ------------------------------------------------------------
bmp_data.copyChannel( source , source_rect , target_pos , 1 , 2 ); // 赤を緑チャンネルへ
bmp_data.copyChannel( source , source_rect , target_pos , 2 , 4 ); // 緑を青チャンネルへ
bmp_data.copyChannel( source , source_rect , target_pos , 4 , 1 ); // 青を赤チャンネルへ
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // 12ef89
カラーチャンネル単位で高速コピーする (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xffe0e0e0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 256 , 256 , true , 0xffef8912 );
// ------------------------------------------------------------
// コピー用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = new Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos:Point = new Point( 20 , 20 );
// ------------------------------------------------------------
// カラーチャンネル単位で高速コピーする
// ------------------------------------------------------------
bmp_data.copyChannel( source , source_rect , target_pos , 1 , 2 ); // 赤を緑チャンネルへ
bmp_data.copyChannel( source , source_rect , target_pos , 2 , 4 ); // 緑を青チャンネルへ
bmp_data.copyChannel( source , source_rect , target_pos , 4 , 1 ); // 青を赤チャンネルへ
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // 12ef89
イメージをスクロールする
scroll() メソッドを使用します。
copyPixels() メソッドを使用した方が、より高度に制御できます。
BitmapData.scroll( x , y ) :Void
第01引数 | Number | 水平方向の移動量(小数の指定は不可) |
第02引数 | Number | 垂直方向の移動量(小数の指定は不可) |
戻り値 | Void | なし |
■スクロールの動作について
イメージ全体を、ドット単位で移動して、書き潰します。
移動して画面外に消えた領域は、失われます。
■使用例
ビットマップをスクロールする (AS1.0)
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap" )
// ------------------------------------------------------------
var bmp_data = flash.display.BitmapData.loadBitmap("my_bitmap");
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function (){
// ビットマップをスクロールする
bmp_data.scroll(2,1);
};
ビットマップをスクロールする (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する (リンケージ識別子 "my_bitmap" )
// ------------------------------------------------------------
var bmp_data:BitmapData = BitmapData.loadBitmap("my_bitmap");
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function ():Void{
// ビットマップをスクロールする
bmp_data.scroll(2,1);
};
イメージをマージする
サンプルをダウンロード
■2つのイメージをマージする
■マージ処理について
2つのビットマップデータを用意します。
素材用のビットマップを、ソースといいます。
編集されるビットマップを、ターゲットといいます。
ターゲット | ソース |
ターゲットの、元のイメージは重要です。
「ソース」と「ターゲット」のピクセルカラーが、融合されます。
結果は、ターゲットに反映されます。(破壊編集)
カラーチャンネルごとに、融合比率を指定できます。
ターゲット | ソース |
■イメージをマージする
merge() メソッドを使用します。
BitmapData.merge( ソース , ソース矩形 , ターゲット側の座標 , 赤融合比率 , 緑融合比率 , 青融合比率 , 透過融合比率 ) :Void
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数 | Number | 赤チャンネルの融合比率 (0~255) |
第05引数 | Number | 緑チャンネルの融合比率 (0~255) |
第06引数 | Number | 青チャンネルの融合比率 (0~255) |
第07引数 | Number | 透過チャンネルの融合比率 (0~255) |
戻り値 | Void | なし |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
■第04~07引数 (融合比率)
0 ~ 255 の数値を指定します。
0 に近いほど、ターゲットに近くなります。
255 に近いほど、ソースに近くなります。
融合式
var d = (ソース色) - (ターゲット色);
var m = (引数値) / 255.0;
(新しい色) = (ターゲット色) + (d * m);
■使用例
2つのイメージをマージする (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xffffb800 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 256 , 256 , true , 0xff0047ff );
// ------------------------------------------------------------
// マージ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = new flash.geom.Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos = new flash.geom.Point( 20 , 20 );
// ------------------------------------------------------------
// イメージをマージする
// ------------------------------------------------------------
bmp_data.merge( source , source_rect , target_pos , 128 , 128 , 128 , 128 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // 7f7f7f
2つのイメージをマージする (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xffffb800 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 256 , 256 , true , 0xff0047ff );
// ------------------------------------------------------------
// マージ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = new Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos:Point = new Point( 20 , 20 );
// ------------------------------------------------------------
// イメージをマージする
// ------------------------------------------------------------
bmp_data.merge( source , source_rect , target_pos , 128 , 128 , 128 , 128 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // 7f7f7f
イメージのパレットマップについて
■パレットマップを使って、イメージをコピーする
paletteMap() メソッドを使用します。
コピー元の素材を、ソースといいます。
実際に書き込まれるコピー先を、ターゲットといいます。
BitmapData.paletteMap( ソース , ソース矩形 , ターゲット側の座標 , 赤パレットマップ , 緑パレットマップ , 青パレットマップ , 透過パレットマップ ) :Void
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数(略可) | Array | 赤チャンネル用のパレットマップ |
第05引数(略可) | Array | 緑チャンネル用のパレットマップ |
第06引数(略可) | Array | 青チャンネル用のパレットマップ |
第07引数(略可) | Array | 透過チャンネル用のパレットマップ |
戻り値 | Void | なし |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
「ターゲット」と「ソース」に、同一の BitmapData 指定も可能です。
■第04~07引数 (パレットマップ)
色をマッピング変換したい場合は、パレットマップを指定します。
無視したい場合は、null をセットします。
■パレットマップについて
配列を作成して、0 から 255 番地までに、加算値をセットします。
任意のピクセルは、自身の色 (0 ~ 255) を使って、パレットマップの番地に格納されている、加算値を参照します。
この加算値は、32ビットカラー(ARGB)を指定します。
自身のチャンネルだけでなく、他のチャンネルにも影響します。
■基礎値について
パレットマップを指定したチャンネルは、0 が基礎値です。
無視したチャンネルは、元の色(0 ~ 255)が基礎値です。
例えば、0xffaabbcc 色があるとします。
(赤、青、透過)を無視している場合、基礎値は 0xffaa00cc です。
(緑、透過)を無視している場合、基礎値は 0xff00bb00 です。
■出力ピクセルカラーについて
基礎値に対して、すべての加算値が足し込まれます。
この合計値が、出力ピクセルカラーとなります。
加算値は、最大で4回マッチする可能性があります。(赤、緑、青、透過)
クランプ処理はありません。単純に32bit整数として、加算されます。
桁の繰り上がりや、繰り下がりが発生すると、色は一周します。
同色は、絶対値指定であり、安全に動作します。
異色は、相対値指定であり、色が一周するリスクがあります。
■パレットマップの作成例
変化しない、デフォルトのパレットマップ
// ------------------------------------------------------------
// パレットマップ用の配列を作成する
// ------------------------------------------------------------
var map_a = new Array(); // 透過チャンネル用のパレットマップ
var map_r = new Array(); // 赤チャンネル用のパレットマップ
var map_g = new Array(); // 緑チャンネル用のパレットマップ
var map_b = new Array(); // 青チャンネル用のパレットマップ
// ------------------------------------------------------------
// パレットマップを初期化する
// ------------------------------------------------------------
var i;
for(i=0;i < 256;i++){
map_a[i] = (i << 24);
map_r[i] = (i << 16);
map_g[i] = (i << 8);
map_b[i] = (i << 0);
}
ネガ反転するパレットマップ
// ------------------------------------------------------------
// パレットマップ用の配列を作成する
// ------------------------------------------------------------
var map_a = new Array(); // 透過チャンネル用のパレットマップ
var map_r = new Array(); // 赤チャンネル用のパレットマップ
var map_g = new Array(); // 緑チャンネル用のパレットマップ
var map_b = new Array(); // 青チャンネル用のパレットマップ
// ------------------------------------------------------------
// パレットマップを初期化する
// ------------------------------------------------------------
var i;
for(i=0;i < 256;i++){
map_a[i] = (( i) << 24);
map_r[i] = ((256 - i) << 16);
map_g[i] = ((256 - i) << 8);
map_b[i] = ((256 - i) << 0);
}
加算作用するデータを埋め込む例
// ------------------------------------------------------------
// パレットマップ用の配列を作成する
// ------------------------------------------------------------
var map_a = new Array(); // 透過チャンネル用のパレットマップ
var map_r = new Array(); // 赤チャンネル用のパレットマップ
var map_g = new Array(); // 緑チャンネル用のパレットマップ
var map_b = new Array(); // 青チャンネル用のパレットマップ
// ------------------------------------------------------------
// パレットマップをデフォルト値で初期化する
// ------------------------------------------------------------
var i;
for(i=0;i < 256;i++){
map_a[i] = (i << 24);
map_r[i] = (i << 16);
map_g[i] = (i << 8);
map_b[i] = (i << 0);
}
// ------------------------------------------------------------
// 赤が 0x80 である場合、赤(+1) 緑(-2) 青(-3) を加算する
// ------------------------------------------------------------
map_r[0x80] += ((1) << 16) + ((-2) << 8) + ((-3) << 0);
// ------------------------------------------------------------
// 青が 0xc0 である場合、赤(-4) 緑(+5) 青(-6) を加算する
// ------------------------------------------------------------
map_b[0xc0] += ((-4) << 16) + ((5) << 8) + ((-6) << 0);
■使用例
パレットマップを使って、イメージをコピーする (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 256 , 256 , true , 0xffa8b8c8 );
// ------------------------------------------------------------
// パレットマップ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = new flash.geom.Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos = new flash.geom.Point( 20 , 20 );
// ------------------------------------------------------------
// デフォルトのパレットマップを用意する
// ------------------------------------------------------------
var map_a = new Array();
var map_r = new Array();
var map_g = new Array();
var map_b = new Array();
var i;
for(i=0;i < 256;i++){
map_a[i] = (i << 24);
map_r[i] = (i << 16);
map_g[i] = (i << 8);
map_b[i] = (i << 0);
}
// ------------------------------------------------------------
// 赤が 0xa8 である場合、赤(+2) 緑(-3) 青(-5) を加算する
// ------------------------------------------------------------
map_r[0xa8] += ((2) << 16) + ((-3) << 8) + ((-5) << 0);
// ------------------------------------------------------------
// パレットマップを使って、イメージをコピーする
// ------------------------------------------------------------
bmp_data.paletteMap( source , source_rect , target_pos , map_r , map_g , map_b , map_a );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // aab5c3
パレットマップを使って、イメージをコピーする (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 256 , 256 , true , 0xffa8b8c8 );
// ------------------------------------------------------------
// パレットマップ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = new Rectangle( 50 , 50 , 256 , 128 );
// ターゲットの位置
var target_pos:Point = new Point( 20 , 20 );
// ------------------------------------------------------------
// デフォルトのパレットマップを用意する
// ------------------------------------------------------------
var map_a:Array = new Array();
var map_r:Array = new Array();
var map_g:Array = new Array();
var map_b:Array = new Array();
var i:Number;
for(i=0;i < 256;i++){
map_a[i] = (i << 24);
map_r[i] = (i << 16);
map_g[i] = (i << 8);
map_b[i] = (i << 0);
}
// ------------------------------------------------------------
// 赤が 0xa8 である場合、赤(+2) 緑(-3) 青(-5) を加算する
// ------------------------------------------------------------
map_r[0xa8] += ((2) << 16) + ((-3) << 8) + ((-5) << 0);
// ------------------------------------------------------------
// パレットマップを使って、イメージをコピーする
// ------------------------------------------------------------
bmp_data.paletteMap( source , source_rect , target_pos , map_r , map_g , map_b , map_a );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// 出力テスト
trace( bmp_data.getPixel(20,20).toString(16) ); // aab5c3
イメージのスレッショルドについて
■しきい値を使って、イメージを転送する
threshold() メソッドを使用します。
調査したいビットマップを、ソースといいます。
比較結果を書き込むビットマップを、ターゲットといいます。
BitmapData.threshold( ソース , ソース矩形 , ターゲット側の座標 , "比較演算子" , しきい値 , カラー値 , マスク値 , copySource? ) :Number
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数 | String | 比較演算子を指定 |
第05引数 | Number | しきいカラーを指定 |
第06引数(略可) | Number | 塗りつぶしカラーを指定 |
第07引数(略可) | Number | マスク値を指定(ソース側のピクセルカラーと論理積される) |
第08引数(略可) | Boolean | true で、比較結果が偽であるピクセルをターゲットにコピー |
戻り値 | Number | 比較結果が真であるピクセルの数 |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
「ターゲット」と「ソース」に、同一の BitmapData 指定も可能です。
■第04引数 (比較演算子)
以下の文字列を指定します。
左辺とは、「(ソース側のピクセルカラー) & (第07引数)」です。
右辺とは、「(第05引数) & (第07引数)」です。
文字列 | 解説 |
"<" | (左辺) < (右辺) |
">" | (左辺) > (右辺) |
"<=" | (左辺) <= (右辺) |
">=" | (左辺) >= (右辺) |
"==" | (左辺) == (右辺) |
"!=" | (左辺) != (右辺) |
■第05引数 (しきい値)
しきいとなる ARGB カラーを指定します。
しきい値は、比較の右辺に使われます。
■第06引数 (塗りつぶし ARGB カラー)
塗りつぶす為の、ARGB カラーを指定します。
比較した結果が真の場合、ターゲット側のピクセルが塗りつぶされます。
偽の場合の動作は、第08引数の設定で決まります。
■第07引数 (マスク値)
マスク値は、ソース側のすべてのピクセルカラーと論理積されます。
ARGB カラーのうち、無視したい領域のビットを 0 とします。
例えば、すべてのカラーを考慮したい場合、0xFFFFFFFF を指定します。
例えば、(透過,緑)のみを考慮したい場合、0xFF00FF00 を指定します。
透過成分のマスクは機能しない?ようです。 0xFF000000 は必ず指定します。
■第08引数 (copySource)
比較した結果が偽だった場合の、ピクセルの設定です。
true を指定すると、ソース側のピクセルをターゲットにコピーします。
falseは、何も起こりません。
ターゲット側の元のピクセルが、そのまま残ります。
デフォルトは、false です。
■使用例
しきい値を使って、イメージを転送する (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = (function(){
// 空のムービークリップを作成
var mc = _root.createEmptyMovieClip( "empty" , _root.getNextHighestDepth() );
// ムービークリップに矩形を描画
var mtx = new flash.geom.Matrix( 256/1638.4 , 0 , 0 , 256/1638.4 , 128 , 128 );
mc.beginGradientFill ( "radial" , [0x000000,0xFFFFFF] , [255,255] , [0,255] , mtx );
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 256 );
mc.lineTo ( 256 , 256 );
mc.lineTo ( 256 , 0 );
mc.endFill();
// BitmapData オブジェクトを作成する(32bit)
var bmp_data1 = new flash.display.BitmapData( 256 , 256 , true , 0x00000000 );
// ビットマップにムービークリップを描画
bmp_data1.draw(mc);
// ムービークリップを破棄
mc.removeMovieClip();
return bmp_data1;
}).call();
// ------------------------------------------------------------
// スレッショルド用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = source.rectangle;
// ターゲットの位置
var target_pos = new flash.geom.Point( 0 , 0 );
// 比較演算子
var operation = "<";
// しきい値
var threshold = 0xFF000000 + (128 << 8);
// 塗りつぶしカラー
var color = 0xFF0000FF;
// マスク値
var mask = 0xFF00FF00;
// 比較結果が偽である場合、ソースからターゲットにコピー
var copy_source = true;
// ------------------------------------------------------------
// しきい値を使って、イメージを転送する
// ------------------------------------------------------------
bmp_data.threshold( source , source_rect , target_pos , operation , threshold , color , mask , copy_source );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
しきい値を使って、イメージを転送する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.geom.Matrix;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = (function():BitmapData{
// 空のムービークリップを作成
var mc:MovieClip = _root.createEmptyMovieClip( "empty" , _root.getNextHighestDepth() );
// ムービークリップに矩形を描画
var mtx:Matrix = new Matrix( 256/1638.4 , 0 , 0 , 256/1638.4 , 128 , 128 );
mc.beginGradientFill ( "radial" , [0x000000,0xFFFFFF] , [255,255] , [0,255] , mtx );
mc.moveTo ( 0 , 0 );
mc.lineTo ( 0 , 256 );
mc.lineTo ( 256 , 256 );
mc.lineTo ( 256 , 0 );
mc.endFill();
// BitmapData オブジェクトを作成する(32bit)
var bmp_data1:BitmapData = new BitmapData( 256 , 256 , true , 0x00000000 );
// ビットマップにムービークリップを描画
bmp_data1.draw(mc);
// ムービークリップを破棄
mc.removeMovieClip();
return bmp_data1;
}).call();
// ------------------------------------------------------------
// スレッショルド用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = source.rectangle;
// ターゲットの位置
var target_pos:Point = new Point( 0 , 0 );
// 比較演算子
var operation:String = "<";
// しきい値
var threshold:Number = 0xFF000000 + (128 << 8);
// 塗りつぶしカラー
var color:Number = 0xFF0000FF;
// マスク値
var mask:Number = 0xFF00FF00;
// 比較結果が偽である場合、ソースからターゲットにコピー
var copy_source:Boolean = true;
// ------------------------------------------------------------
// しきい値を使って、イメージを転送する
// ------------------------------------------------------------
bmp_data.threshold( source , source_rect , target_pos , operation , threshold , color , mask , copy_source );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
ビットマップのエフェクトについて
■カラートランスフォーム変換後の結果を描画する
colorTransform() メソッドを使用します。
呼び出したビットマップに、上書き編集されます。
BitmapData.colorTransform( 適用矩形 , ColorTransform ) :Void
第01引数 | Rectangle | 適用矩形範囲を、Rectangle 型で指定 |
第02引数 | ColorTransform | カラー変換を、ColorTransform 型で指定 |
戻り値 | Void | なし |
■第02引数 カラートランスフォーム
こちらで解説しています。
■使用例
カラートランスフォーム変換後の結果を描画する (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0xffffb800 );
// ------------------------------------------------------------
// ColorTransform オブジェクトを作成
// ------------------------------------------------------------
var color_transform = new flash.geom.ColorTransform();
color_transform.redMultiplier = 0.5;
color_transform.greenMultiplier = 0.5;
color_transform.blueMultiplier = 1.0;
color_transform.redOffset = 0;
color_transform.greenOffset = 0;
color_transform.blueOffset = 255;
// ------------------------------------------------------------
// カラートランスフォーム変換後の結果を描画する
// ------------------------------------------------------------
bmp_data.colorTransform( bmp_data.rectangle , color_transform );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
カラートランスフォーム変換後の結果を描画する (AS2.0)
import flash.display.BitmapData;
import flash.geom.ColorTransform;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0xffffb800 );
// ------------------------------------------------------------
// ColorTransform オブジェクトを作成
// ------------------------------------------------------------
var color_transform:ColorTransform = new ColorTransform();
color_transform.redMultiplier = 0.5;
color_transform.greenMultiplier = 0.5;
color_transform.blueMultiplier = 1.0;
color_transform.redOffset = 0;
color_transform.greenOffset = 0;
color_transform.blueOffset = 255;
// ------------------------------------------------------------
// カラートランスフォーム変換後の結果を描画する
// ------------------------------------------------------------
bmp_data.colorTransform( bmp_data.rectangle , color_transform );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■フィルタ適用後の結果を描画する
applyFilter() メソッドを使用します。
素材用のビットマップを、ソースといいます。
描画されるビットマップを、ターゲットといいます。
BitmapData.applyFilter( ソース , ソース矩形 , ターゲット側の座標 , フィルタ ) :Number
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数 | BitmapFilter | フィルタ系のオブジェクトを指定する |
戻り値 | Number | 成功した場合 0 が得られる。エラーが発生すると負数が得られる。 |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
「ターゲット」と「ソース」に、同一の BitmapData 指定も可能です。
■第03引数 (ターゲット側の座標)
ターゲット座標系に、第02引数でクリップしたソースを配置します。
実際の描画範囲は、配置したソース矩形範囲よりも肥大します。
■第04引数 (フィルタ)
フィルタについては、こちらで解説しています。
クラス名 | 効果 |
BlurFilter | ブラー(ぼかし) |
BevelFilter | ベベル |
GradientBevelFilter | グラデーションベベル |
GlowFilter | グロー |
GradientGlowFilter | グラデーショングロー |
DropShadowFilter | ドロップシャドウ |
ColorMatrixFilter | カラーマトリックス |
ConvolutionFilter | コンボリューション |
DisplacementMapFilter | ディスプレイスメントマップ |
■ターゲットイメージのサイズについて
■使用例
フィルタ適用後の結果を描画する (AS1.0)
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 64 , 64 , true , 0xff884400 );
// ------------------------------------------------------------
// BlurFilter オブジェクトを作成する
// ------------------------------------------------------------
var blur_filter = new flash.filters.BlurFilter( 8 , 8 , 1 );
// ------------------------------------------------------------
// フィルタ適用後のサイズを取得する
// ------------------------------------------------------------
var filter_rect = source.generateFilterRect( source.rectangle , blur_filter );
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( filter_rect.width , filter_rect.height , true , 0x00000000 );
// ------------------------------------------------------------
// フィルタ描画用パラメータ
// ------------------------------------------------------------
// ターゲットの位置
var target_pos = new flash.geom.Point( -filter_rect.x , -filter_rect.y );
// ------------------------------------------------------------
// フィルタ適用後の結果を描画する
// ------------------------------------------------------------
bmp_data.applyFilter( source , source.rectangle , target_pos , blur_filter );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
フィルタ適用後の結果を描画する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.filters.BlurFilter;
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 64 , 64 , true , 0xff884400 );
// ------------------------------------------------------------
// BlurFilter オブジェクトを作成する
// ------------------------------------------------------------
var blur_filter:BlurFilter = new BlurFilter( 8 , 8 , 1 );
// ------------------------------------------------------------
// フィルタ適用後のサイズを取得する
// ------------------------------------------------------------
var filter_rect:Rectangle = source.generateFilterRect( source.rectangle , blur_filter );
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( filter_rect.width , filter_rect.height , true , 0x00000000 );
// ------------------------------------------------------------
// フィルタ描画用パラメータ
// ------------------------------------------------------------
// ターゲットの位置
var target_pos:Point = new Point( -filter_rect.x , -filter_rect.y );
// ------------------------------------------------------------
// フィルタ適用後の結果を描画する
// ------------------------------------------------------------
bmp_data.applyFilter( source , source.rectangle , target_pos , blur_filter );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■フィルタ適用後のサイズを取得する
generateFilterRect() メソッドを使用します。
このメソッドは、ソースから呼び出します。
BitmapData.generateFilterRect( ソース矩形 , フィルタ ) :Rectangle
第01引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第02引数 | BitmapFilter | フィルタ系のオブジェクトを指定する |
戻り値 | Rectangle | フィルタ適用後のサイズが得られる。 |
■第02引数 (フィルタ)
フィルタについては、こちらで解説しています。
クラス名 | 効果 |
BlurFilter | ブラー(ぼかし) |
BevelFilter | ベベル |
GradientBevelFilter | グラデーションベベル |
GlowFilter | グロー |
GradientGlowFilter | グラデーショングロー |
DropShadowFilter | ドロップシャドウ |
ColorMatrixFilter | カラーマトリックス |
ConvolutionFilter | コンボリューション |
DisplacementMapFilter | ディスプレイスメントマップ |
■使用例
フィルタ適用後のサイズを取得する (AS1.0)
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 64 , 64 , true , 0xff884400 );
// ------------------------------------------------------------
// BlurFilter オブジェクトを作成する
// ------------------------------------------------------------
var blur_filter = new flash.filters.BlurFilter( 8 , 8 , 1 );
// ------------------------------------------------------------
// フィルタ適用後のサイズを取得する
// ------------------------------------------------------------
var filter_rect = source.generateFilterRect( source.rectangle , blur_filter );
// 出力テスト
trace( source.rectangle ); // x: 0, y: 0, w:64, h:64
trace( filter_rect ); // x:-4, y:-4, w:72, h:72
フィルタ適用後のサイズを取得する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.filters.BlurFilter;
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 64 , 64 , true , 0xff884400 );
// ------------------------------------------------------------
// BlurFilter オブジェクトを作成する
// ------------------------------------------------------------
var blur_filter:BlurFilter = new BlurFilter( 8 , 8 , 1 );
// ------------------------------------------------------------
// フィルタ適用後のサイズを取得する
// ------------------------------------------------------------
var filter_rect:Rectangle = source.generateFilterRect( source.rectangle , blur_filter );
// 出力テスト
trace( source.rectangle ); // x: 0, y: 0, w:64, h:64
trace( filter_rect ); // x:-4, y:-4, w:72, h:72
ランダムノイズを描画する
サンプルをダウンロード
■イメージにランダムノイズを描画する
noise() メソッドを使用します。
BitmapData.noise( 乱数の種 , カラー最小値 , カラー最高値 , カラーチャンネル , グレースケール? ) :Void
第01引数 | Number | 乱数の種となる、4バイト整数値を指定 |
第02引数 | Number | カラー成分の最小値を指定 (0 ~ 255) |
第03引数 | Number | カラー成分の最大値を指定 (0 ~ 255) |
第04引数(略可) | Number | 使用するカラーチャンネルを論理和で指定 0x01(赤) 0x02(緑) 0x04(青) 0x08(透) |
第05引数(略可) | Number | trueでグレースケール化, falseでカラーチャンネルごとにランダム |
戻り値 | Void | なし |
■第01引数 (乱数の種)
乱数の種となる、4バイト整数値を指定します。
全く同じ結果を再現したい場合、毎回同じ値を指定します。
■第04引数 (カラーチャンネル)
使用するカラーチャンネルを、論理和で指定します。
デフォルト値は、(4|2|1) です。
赤緑青チャンネルを省略すると、色は 0 となります。
透過チャンネルをを省略すると、色は 255 となります。
数値 | 解説 |
0x01 | 赤色チャンネル |
0x02 | 緑色チャンネル |
0x04 | 青色チャンネル |
0x08 | 透過チャンネル |
■第05引数 (グレースケール)
true を指定すると、グレースケール化します。
第04引数の、透過チャンネルの有無で、結果はさらに変化します。
デフォルト値は、false です。
true | false |
■使用例
イメージにランダムノイズを描画する (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function (){
// ------------------------------------------------------------
// ランダムノイズ描画用パラメータ
// ------------------------------------------------------------
// 乱数の種
var random_seed = Math.floor(Math.random() * 0x7FFFFFFF);
// カラー成分の最小値
var color_low = 0;
// カラー成分の最大値
var color_high = 255;
// 使用するカラーチャンネル
var channel_options = (8|1|2|4);
// グレースケール化
var gray_scale = false;
// ------------------------------------------------------------
// イメージにランダムノイズを描画する
// ------------------------------------------------------------
bmp_data.noise( random_seed , color_low , color_high , channel_options , gray_scale );
};
イメージにランダムノイズを描画する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function ():Void{
// ------------------------------------------------------------
// ランダムノイズ描画用パラメータ
// ------------------------------------------------------------
// 乱数の種
var random_seed:Number = Math.floor(Math.random() * 0x7FFFFFFF);
// カラー成分の最小値
var color_low:Number = 0;
// カラー成分の最大値
var color_high:Number = 255;
// 使用するカラーチャンネル
var channel_options:Number = (8|1|2|4);
// グレースケール化
var gray_scale:Boolean = false;
// ------------------------------------------------------------
// イメージにランダムノイズを描画する
// ------------------------------------------------------------
bmp_data.noise( random_seed , color_low , color_high , channel_options , gray_scale );
};
パーリンノイズを描画する(Perlin Noise)
サンプルをダウンロード
■ Perlin Noise について
テクスチャを作成する為の、ノイズ関数の一種です。
炎、雷、煙、雲、水、海、波などの表現に使われます。
ビットマップに描画して、素材をリアルタイムに生成できます。
潜在的なサイズは、無限に広がっており、連続して繋がっています。
■イメージにパーリンノイズを描画する
perlinNoise() メソッドを使用します。
BitmapData.perlinNoise( 水平周波数, 垂直周波数, オクターブの個数 , 乱数の種 , タイリング? , フラクタルノイズ? , カラーチャンネル , グレイスケール? , オフセットリスト ) :Void
第01引数 | Number | 水平方向の周波数を指定 |
第02引数 | Number | 垂直方向の周波数を指定 |
第03引数 | Number | オクターブの個数、周波数を半分にした結果が、レイヤーのように重なる |
第04引数 | Number | 乱数の種となる、4バイト整数値を指定 |
第05引数 | Boolean | trueでタイリング化を試みる, falseで無限大 |
第06引数 | Boolean | trueでフラクタルノイズを生成, falseで乱流を生成 |
第07引数(略可) | Number | 使用するカラーチャンネルを論理和で指定 0x01(赤) 0x02(緑) 0x04(青) 0x08(透) |
第08引数(略可) | Boolean | trueでグレースケール化, falseでカラーチャンネルごとにランダム |
第09引数(略可) | Array | 配列に Point オブジェクトを格納して指定。第03引数の個数分用意する。 |
戻り値 | Void | なし |
■第01~02引数 (周波数)
周波数を、ピクセル数で指定します。
指定サイズの周期で、明暗の波がちょうど1周します。
第05引数が有効な場合、実際の周波数は、丸め補正されます。
■第03引数 (オクターブの個数)
指定した回数で、重ねて描画されます。
レイヤーのように分離しており、第09引数から配置位置を変更できます。
任意のレイヤーの周波数は、1つ前の周波数を半分にしたものです。
1枚目の周波数 (1/1)
2枚目の周波数 (1/2)
3枚目の周波数 (1/4)
4枚目の周波数 (1/8)
5枚目の周波数 (1/16)
6枚目の周波数 (1/32) ...
個数を増やせば増やすほど、処理コストが比例して増大します。
最低でも、1 を指定します。
■第04引数 (乱数の種)
乱数の種となる、4バイト整数値を指定します。
全く同じ結果を再現したい場合、毎回同じ値を指定します。
■第05引数 (タイリング化)
デフォルトは、false です。
パーリンノイズは、無限に広がっており、すべて自然に繋がっています。
表示位置は、第09引数から変更できます。
true を指定すると、タイル配置した際に、自然に繋がるように補正されます。
タイリングの周期は、ビットマップのサイズです。
■第06引数 (フラクタルノイズ)
true で、フラクタルノイズを生成します。
1枚 透過なし | 1枚 透過あり | 5枚 透過なし | 5枚 透過あり |
false で、乱流的ノイズを生成します。
1枚 透過なし | 1枚 透過あり | 5枚 透過なし | 5枚 透過あり |
■第07引数 (カラーチャンネル)
使用するカラーチャンネルを、論理和で指定します。
デフォルト値は、(4|2|1) です。
赤緑青チャンネルを省略すると、色は 0 となります。
透過チャンネルをを省略すると、色は 255 となります。
数値 | 解説 |
0x01 | 赤色チャンネル |
0x02 | 緑色チャンネル |
0x04 | 青色チャンネル |
0x08 | 透過チャンネル |
■第08引数 (グレースケール)
true を指定すると、グレースケール化します。
第07引数の、透過チャンネルの有無で、結果はさらに変化します。
デフォルト値は、false です。
true | false |
■第09引数 (座標リスト)
第03引数で指定した個数分の、レイヤーが存在します。
これらのレイヤーの配置位置を、それぞれ変更できます。
配列を作成し、必要な数だけ Point オブジェクトを格納します。
パーリンノイズは、無限に広がっています。
ビットマップに描画されるのは、その一部です。
■パーリンノイズの描画例
■1枚描画
イメージにパーリンノイズを描画する (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// パーリンノイズ描画用パラメータ
// ------------------------------------------------------------
// 水平方向の周波数
var base_x = 64;
// 垂直方向の周波数
var base_y = 64;
// オクターブの個数
var num_octaves = 1;
// 乱数の種
var random_seed = Math.floor(Math.random() * 0x7FFFFFFF);
// タイリング化
var stitch = false;
// フラクタルノイズを使用
var fractal_noise = false;
// 使用するカラーチャンネル
var channel_options = (1|2|4);
// グレースケール化
var gray_scale = false;
// ------------------------------------------------------------
// イメージにパーリンノイズを描画する
// ------------------------------------------------------------
bmp_data.perlinNoise( base_x , base_y , num_octaves , random_seed , stitch , fractal_noise ,channel_options , gray_scale );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
イメージにランダムノイズを描画する (AS2.0)
import flash.display.BitmapData;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new flash.display.BitmapData( 512 , 512 , true , 0x00000000 );
// ------------------------------------------------------------
// パーリンノイズ描画用パラメータ
// ------------------------------------------------------------
// 水平方向の周波数
var base_x:Number = 64;
// 垂直方向の周波数
var base_y:Number = 64;
// オクターブの個数
var num_octaves:Number = 1;
// 乱数の種
var random_seed:Number = Math.floor(Math.random() * 0x7FFFFFFF);
// タイリング化
var stitch:Boolean = false;
// フラクタルノイズを使用
var fractal_noise:Boolean = false;
// 使用するカラーチャンネル
var channel_options:Number = (1|2|4);
// グレースケール化
var gray_scale:Boolean = false;
// ------------------------------------------------------------
// イメージにパーリンノイズを描画する
// ------------------------------------------------------------
bmp_data.perlinNoise( base_x , base_y , num_octaves , random_seed , stitch , fractal_noise ,channel_options , gray_scale );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
■複数枚スクロールアニメ
パーリンノイズをスクロールアニメ (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 256 , 256 , true , 0x00000000 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// パーリンノイズ描画用パラメータ
// ------------------------------------------------------------
// 水平方向の周波数
var base_x = 128;
// 垂直方向の周波数
var base_y = 128;
// オクターブの個数
var num_octaves = 3;
// 乱数の種
var random_seed = Math.floor(Math.random() * 0x7FFFFFFF);
// タイリング化
var stitch = false;
// フラクタルノイズを使用
var fractal_noise = false;
// 使用するカラーチャンネル
var channel_options = (0);
// グレースケール化
var gray_scale = true;
// オフセットリスト
var offset_list = new Array();
// 速度リスト
var speed_list = new Array();
// ------------------------------------------------------------
// オフセットリストを初期化
// ------------------------------------------------------------
var speed = Math.random() * 0.5 + 2;
var rotate = Math.PI * 2.0 * Math.random();
var i;
for(i=0;i < num_octaves;i++){
// 位置ベクトル
var pos = new flash.geom.Point( 0 , 0 );
// 速度ベクトル
var r = (30 * (Math.random() * 2 - 1) + rotate) * Math.PI / 180;
var s = (0.25) * (Math.random() * 2 - 1) + speed;
var spd = new flash.geom.Point( Math.cos(r) * s , Math.sin(r) * s );
speed *= 0.75;
offset_list[i] = pos;
speed_list[i] = spd;
}
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function (){
// ------------------------------------------------------------
// オフセットを加算
// ------------------------------------------------------------
var i;
for(i=0;i < num_octaves;i++){
var pos = offset_list[i];
var spd = speed_list[i];
pos.x += spd.x;
pos.y += spd.y;
}
// ------------------------------------------------------------
// イメージにパーリンノイズを描画する
// ------------------------------------------------------------
bmp_data.perlinNoise( base_x , base_y , num_octaves , random_seed , stitch , fractal_noise ,channel_options , gray_scale , offset_list );
};
パーリンノイズをスクロールアニメ (AS2.0)
import flash.display.BitmapData;
import flash.geom.Point;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 256 , 256 , true , 0x00000000 );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// パーリンノイズ描画用パラメータ
// ------------------------------------------------------------
// 水平方向の周波数
var base_x:Number = 128;
// 垂直方向の周波数
var base_y:Number = 128;
// オクターブの個数
var num_octaves:Number = 3;
// 乱数の種
var random_seed:Number = Math.floor(Math.random() * 0x7FFFFFFF);
// タイリング化
var stitch:Boolean = false;
// フラクタルノイズを使用
var fractal_noise:Boolean = false;
// 使用するカラーチャンネル
var channel_options:Number = (0);
// グレースケール化
var gray_scale:Boolean = true;
// オフセットリスト
var offset_list:Array = new Array();
// 速度リスト
var speed_list:Array = new Array();
// ------------------------------------------------------------
// オフセットリストを初期化
// ------------------------------------------------------------
var speed:Number = Math.random() * 0.5 + 2;
var rotate:Number = Math.PI * 2.0 * Math.random();
var i:Number;
for(i=0;i < num_octaves;i++){
// 位置ベクトル
var pos:Point = new Point( 0 , 0 );
// 速度ベクトル
var r:Number = (30 * (Math.random() * 2 - 1) + rotate) * Math.PI / 180;
var s:Number = (0.25) * (Math.random() * 2 - 1) + speed;
var spd:Point = new Point( Math.cos(r) * s , Math.sin(r) * s );
speed *= 0.75;
offset_list[i] = pos;
speed_list[i] = spd;
}
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function ():Void{
// ------------------------------------------------------------
// オフセットを加算
// ------------------------------------------------------------
var i:Number;
for(i=0;i < num_octaves;i++){
var pos:Point = offset_list[i];
var spd:Point = speed_list[i];
pos.x += spd.x;
pos.y += spd.y;
}
// ------------------------------------------------------------
// イメージにパーリンノイズを描画する
// ------------------------------------------------------------
bmp_data.perlinNoise( base_x , base_y , num_octaves , random_seed , stitch , fractal_noise ,channel_options , gray_scale , offset_list );
};
ピクセルディゾルブについて
サンプルをダウンロード
■イメージをピクセルディゾルブで置換する
■ピクセルディゾルブ処理について
2つのビットマップデータを用意します。
素材用のビットマップを、ソースといいます。
編集されるビットマップを、ターゲットといいます。
ターゲット | ソース |
ターゲットの、元のイメージは重要です。
「ターゲット」から「ソース」へと、絵が少しずつ変化します。
指定した個数ずつ、ピクセル単位で置換されます。
結果は、ターゲットに反映されます。(破壊編集)
ターゲット | ソース |
■イメージをピクセルディゾルブで置換する
pixelDissolve() メソッドを使用します。
このメソッドは、何度か繰り返して実行します。
BitmapData.pixelDissolve( ソース , ソース矩形 , ターゲット側の座標 , 乱数の種 , 置換ピクセル数 , ARGBカラー ) :Number
第01引数 | BitmapData | ソースを指定 |
第02引数 | Rectangle | ソースの矩形範囲を、Rectangle 型で指定 |
第03引数 | Point | ターゲット側の配置座標を、Point 型で指定 |
第04引数(略可) | Number | 乱数の種となる、4バイト整数値を指定(2回目以降は、戻り値から得られた値を指定) |
第05引数(略可) | Number | 1度に置換するピクセル数を指定 |
第06引数(略可) | Number | ARGB カラーを指定。(ターゲットとソースが同一である場合、単一色で塗りつぶされる) |
戻り値 | Number | 新しい乱数の種 |
■第01引数 (ソース)
ソースとなる、BitmapData オブジェクトを指定します。
■第02引数 (ソース側の矩形範囲)
ソース側の矩形範囲を、Rectangle 型で指定します。
この幅と高さから、置換する総ピクセル数が確定します。
(総ピクセル数) = (ソース矩形の幅) * (ソース矩形の高さ)
■第04引数 (乱数の種)
1回目の呼び出しは、好きな4バイト整数値(乱数の種)を指定します。
戻り値から、新しい乱数の種が得られます。
2回目以降の呼び出しは、この乱数の種を指定します。
■第05引数 (置換ピクセル数)
1回の処理で置換する、ピクセル数を指定します。
総ピクセル数は、第03引数で確定します。
このメソッドを実行する回数は、第03引数と第05引数で確定します。
(実行回数) = Math.ceil( (総ピクセル数) * (第05引数) )
好きなフレーム数から、第05引数の値を計算する事もできます。
(第05引数) = Math.ceil( (総ピクセル数) / (実行回数) )
■第06引数 (ARGBカラー)
指定した、ARGB カラーで塗りつぶされます。
これは、ターゲットとソースが同一である場合のみ、効果があります。
■使用例
イメージをピクセルディゾルブで置換する (AS1.0)
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data = new flash.display.BitmapData( 256 , 256 , true , 0xffffc0c0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source = new flash.display.BitmapData( 256 , 256 , true , 0xff0000ff );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// ピクセルディゾルブ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect = source.rectangle;
// ターゲットの位置
var target_pos = new flash.geom.Point( 0 , 0 );
// 乱数の種
var random_seed = Math.floor(Math.random() * 0x7FFFFFFF);
// ------------------------------------------------------------
// ピクセル数を計算
// ------------------------------------------------------------
// 総ピクセル数
var total = (source_rect.width * source_rect.height);
// 残りのピクセル数
var remnant = total;
// 1回の処理で置換するピクセル数(ここでは 120 フレーム分)
var number_of_pixels = Math.ceil(total / 120);
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function (){
// ------------------------------------------------------------
// イメージをピクセルディゾルブで置換する
// ------------------------------------------------------------
random_seed = bmp_data.pixelDissolve( source , source_rect , target_pos , random_seed , number_of_pixels );
// ------------------------------------------------------------
// 終了チェック
// ------------------------------------------------------------
remnant -= number_of_pixels;
if(remnant <= 0){
delete _root.onEnterFrame;
}
};
イメージをピクセルディゾルブで置換する (AS2.0)
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.geom.Point;
// ------------------------------------------------------------
// ターゲット用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var bmp_data:BitmapData = new BitmapData( 256 , 256 , true , 0xffffc0c0 );
// ------------------------------------------------------------
// ソース用 BitmapData オブジェクトを作成する(32bit)
// ------------------------------------------------------------
var source:BitmapData = new BitmapData( 256 , 256 , true , 0xff0000ff );
// ------------------------------------------------------------
// _root に配置して確認する
// ------------------------------------------------------------
_root.attachBitmap( bmp_data , 0 );
// ------------------------------------------------------------
// ピクセルディゾルブ用パラメータ
// ------------------------------------------------------------
// ソースの矩形範囲
var source_rect:Rectangle = source.rectangle;
// ターゲットの位置
var target_pos:Point = new Point( 0 , 0 );
// 乱数の種
var random_seed:Number = Math.floor(Math.random() * 0x7FFFFFFF);
// ------------------------------------------------------------
// ピクセル数を計算
// ------------------------------------------------------------
// 総ピクセル数
var total:Number = (source_rect.width * source_rect.height);
// 残りのピクセル数
var remnant:Number = total;
// 1回の処理で置換するピクセル数(ここでは 120 フレーム分)
var number_of_pixels:Number = Math.ceil(total / 120);
// ------------------------------------------------------------
// 毎フレーム実行されるイベント
// ------------------------------------------------------------
_root.onEnterFrame = function ():Void{
// ------------------------------------------------------------
// イメージをピクセルディゾルブで置換する
// ------------------------------------------------------------
random_seed = bmp_data.pixelDissolve( source , source_rect , target_pos , random_seed , number_of_pixels );
// ------------------------------------------------------------
// 終了チェック
// ------------------------------------------------------------
remnant -= number_of_pixels;
if(remnant <= 0){
delete _root.onEnterFrame;
}
};
BitmapData クラスの機能一覧
■BitmapData クラスの機能一覧
■プロパティ一覧(読み取り専用)
プロパティ名 | 型 | 説明 |
width | Number | ビットマップの幅を取得する |
height | Number | ビットマップの高さを取得する |
rectangle | Rectangle | ビットマップのサイズを Rectangle 型で取得する |
transparent | Boolean | 透過付き(32bit)ビットマップであるか? |
■メソッド
メソッド名 | 説明 |
loadBitmap() | 埋め込んだ画像ファイルから、BitmapData オブジェクトを作成する。 |
dispose() | BitmapData オブジェクトを解放する。 |
メソッド名 | 説明 |
getColorBoundsRect() | 指定カラーをすべて含む、矩形サイズを取得する。 |
hitTest() | ビットマップとの当たり判定を調べる。 |
getPixel() | RGB ピクセルカラー(24bit)を取得する。 |
setPixel() | RGB ピクセルカラー(24bit)を設定する。 |
getPixel32() | ARGB ピクセルカラー(32bit)を取得する。 |
setPixel32() | ARGB ピクセルカラー(32bit)を設定する。 |
fillRect() | ビットマップを塗りつぶす(矩形指定) |
floodFill() | ビットマップを塗りつぶす(塗りつぶしツール方式) |
draw() | ビットマップにレンダリング(キャプチャ)する |
メソッド名 | 説明 |
clone() | BitmapData オブジェクトを複製する |
copyChannel() | イメージを高速コピーする(カラーチャンネル単位) |
copyPixels() | イメージを高速コピーする(ピクセルカラー) |
paletteMap() | イメージを転送する(パレットマップによる変換) |
threshold() | イメージを転送する(しきい値による抽出) |
scroll() | イメージをスクロールする。 |
merge() | 2つのイメージをマージする。 |
メソッド名 | 説明 |
colorTransform() | カラートランスフォーム変換後の結果を描画する。 |
applyFilter() | フィルタ適用後の結果を描画する。 |
generateFilterRect() | フィルタ適用後のサイズを取得する。 |
noise() | ランダムノイズを描画する。 |
perlinNoise() | パーリンノイズを描画する(Perlin Noise) |
pixelDissolve() | イメージをピクセルディゾルブで置換する |