「BitmapClipクラス」の版間の差分

2014年8月21日 (木) 13:12時点における最新版

BitmapClipクラスとは?

BitmapClipクラスは、１つの画像のみで構成されておりタイムラインなども存在しません。
Movieクラスと違い、サイズの取得なども行うことができます。またMovieクラスにくらべ動作も軽いので
パーティクルなどで大量に使用する際に便利です。
BitmapClipはFlash上で配置することはできず、スクリプトを使って生成します。

BitmapClipを作る

BitmapClipはMovieにattachすることで生成することができます。
下記はそのサンプルになります。

//BitmapClipを作る
var bitmapClip = <Movieインスタンス>.attachBitmap("hoge.png", 1);

<Movieインスタンス>.attachBitmapでMovieにBitmapClipをattachすることができます。
attachBitmapの第一引数にはattachしたい画像のリンケージ名を指定します。
第二引数には深度を指定します。深度は0からはじまり整数で、かつ順番に指定する必要があるので注意してください。

※Flashのライブラリ上で使用数0になっている画像はLWFに書き出されないので、attachBitmapだけにしか使用しない画像がある場合は
　適当なムービークリップにその画像を入れて使用数を1以上にしてください。
　そのムービークリップ自体が実際LWFで使われなくても問題ありません。
　

BitmapClipを移動する

BitmapClipを移動させるサンプルです

//BitmapClipをx:100,y:100に移動させる
<BitmapClipインスタンス>.x = 100;
<BitmapClipインスタンス>.y = 100;

BitmapClipを回転する

BitmapClipを回転するサンプルです。

//BitmapClipを45度回転させる
<BitmapClipインスタンス>.rotation = 45;

BitmapClipを拡大縮小する

BitmapClipをjavascriptで拡縮させるサンプルです。

//BitmapClipのスケールを2倍にする
<BitmapClipインスタンス>.scaleX = 2;
<BitmapClipインスタンス>.scaleY = 2;

//BitmapClipを反転する
<BitmapClipインスタンス>.scaleX = -1;

BitmapClipを透明にする

BitmapClipのアルファ(透明度)を設定します。0で透明　1で不透明になります。

//BitmapClipを半透明にする
<BitmapClipインスタンス>.alpha = 0.5;

完全に非表示したい場合はalphaよりvisibleを使用してください。
alpha=0; は visible=false より描画負荷がかかってしまいます。

BitmapClipを非表示にする

BitmapClipの表示状態を設定します。

//BitmapClipを非表示する
<BitmapClipインスタンス>.visible = false;
//BitmapClipを表示する
<BitmapClipインスタンス>.visible = true;

BitmapClipの深度を変更する

BitmapClipの深度を入れ替えるにはMovieが配列で管理しているBitmapClipの順番を変えることで行います 下記はBitmapClipの深度を変更するサンプルです。

//BitmapClipを生成
var hoge = <Movieインスタンス>.attachBitmap("hoge.png", 1);
var hoge2 = <Movieインスタンス>.attachBitmap("hoge.png", 0);

//Movieが管理しているBitmapClipを配列で取得
var bitmaps = <Movieインスタンス>.getAttachedBitmaps();
 
//深度を入れ替え
bitmaps[1] = hoge2;
bitmaps[0] = hoge;

BitmapClipの変形基準点を変更する

BitmapClipはMovieと違いFlashで変形基準点を編集することができないので、デフォルトでは左上が変形基準点になっています。
その基準点を下記のサンプルのように移動することができます。

//変形基準点を中心に持ってくる
<BitmapClipインスタンス>.regX = <BitmapClipインスタンス>.width * 0.5;
<BitmapClipインスタンス>.regY = <BitmapClipインスタンス>.height * 0.5;

BitmapClipのサイズを取得する

BitmapClipを構成している一枚の画像の原寸サイズを取得することができます。
取得できるサイズはあくまで画像のサイズです。matrix値が反映されたサイズではないので注意してください。
下記はサンプルになります。

//画像のサイズを取得
var width = <BitmapClipインスタンス>.width;
var height = <BitmapClipインスタンス>.height;

BitmapClipにトゥイーンを適用する

BitmapClipと同じようにBitmapClipにもTweenクラスを適用してアニメーションさせることができます。

//サンプル1
<BitmapClipインスタンス>.addTween()
    .easing(Tween.Easing.Quadric.Out)  //イージング設定
    .to({x:150,y:200},24)              //(24フレームかけてx:150,y:200)へ移動
    .onComplete(function(){            //移動が完了したら指定した関数を実行
        console.log("着きました");
    })
    .start();                          //スタート

//------------------------------------------------------------

//サンプル2
<BitmapClipインスタンス>.addTween()
    .to({x:100},24)                    //24フレームかけて(x:100)へ移動
    .start()                           //スタート
    .chain()　　　　　　　　　　　　　 //(x:100)への移動が完了した後に新たなトゥイーンを生成
    .delay(24)                         //24フレーム、ウェイト状態に
    .onComplete(function(){            //24フレームウェイトが完了したら実行する関数
        console.log("24フレーム待ちました");
    })
    .chain()
    .to({rotation:180},12)             //12フレームかけて180度回転
    .onComplete(function(){            //回転が完了したら実行する関数
        console.log("完了");
    })

※Tweenクラスの詳しい扱い方
Tweenクラス
API