スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

--.--.-- | | スポンサー広告

Flex2で残像表示

前回のエントリだんだんぼやける残像で作ったのと同じようなモノをActionScript3.0でも書いてみました。




今回もクリックすると残像の効果が切り替わりマス。

やってるコトはフラッシュのものと大して変わらないのですが、コッチは表示してるシンボルはPNG画像を読み込んだモノです。

ソースコードは、以下のようなカンジです。

package {
import flash.display.*;
import flash.events.*;
// メインクラス
public class AfterImageSample extends Sprite {
// 画像リソース
[Embed(source='ball.png')]
private var BallBitmap:Class;
// 画像
private var _ballBitmap:Bitmap;
// 移動体
private var _chaser:Chaser;
// 残像生成インターバル
private var _interval:Number = 1;
// インターバルカウンタ
private var _intervalCnt:Number = 0;
// 残像タイプフラグ
private var _isAlpha:Boolean = true;
// コンストラクタ
public function AfterImageSample() {
// 画像
_ballBitmap = new BallBitmap();
// 移動体
_chaser = new Chaser();
_chaser.addChild(_ballBitmap);
_chaser.x = 100;
_chaser.y = 100;
_chaser.addEventListener(MouseEvent.CLICK, onChaserClick);
addChild(_chaser);
// イベントリスナ
addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
// フレーム毎の処理
private function onEnterFrame(evt:Event):void {
_intervalCnt++;
if (_intervalCnt > _interval) {
// 残像を作成
var afterImage:AfterImage;
if (_isAlpha) {
afterImage = new AlphaAfterImage(_ballBitmap.bitmapData);
} else {
afterImage = new BlurAfterImage(_ballBitmap.bitmapData);
}
addChildAt(afterImage, getChildIndex(_chaser));
afterImage.x = _chaser.x;
afterImage.y = _chaser.y;
afterImage.effect();
// カウンタをリセット
_intervalCnt = 0;
}
// 移動
_chaser.moveTo(mouseX - _chaser.width / 2, mouseY - _chaser.height / 2);
}
// 移動体をクリックした時の処理
private function onChaserClick(evt:Event):void {
_isAlpha = !_isAlpha;
}
}
}
import flash.display.*;
import flash.events.*;
import flash.filters.BlurFilter;
// 移動体
class Chaser extends Sprite {
// 加速度
private var _k:Number = 0.15;
// 減衰係数
private var _a:Number = 0.65;
// x方向の速度
private var _speedX:Number = 0;
// y方向の速度
private var _speedY:Number = 0;
// 目標に対して移動
public function moveTo(x:Number, y:Number):void {
_speedX = _k * (x - this.x) + _a * _speedX;
_speedY = _k * (y - this.y) + _a * _speedY;
this.x += _speedX;
this.y += _speedY;
}
}
// 残像クラス
class AfterImage extends Sprite {
// 画像
private var _bitmap:Bitmap;
// 残像の寿命
private var _life:Number = 12;
// 寿命カウンタ
private var _lifeCnt:Number = 0;
// コンストラクタ
public function AfterImage(bitmapData:BitmapData) {
_bitmap = new Bitmap();
_bitmap.bitmapData = bitmapData;
addChild(_bitmap);
// イベントリスナ
addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
// 残像効果
public function effect():void {
// テンプレートメソッドなので未実装
}
// フレーム毎の処理
private function onEnterFrame(evt:Event):void {
effect();
_lifeCnt++;
// 寿命に達したら消滅
if (_lifeCnt++ > _life) {
this.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
parent.removeChild(this);
}
}
}
// アルファ残像
class AlphaAfterImage extends AfterImage {
// 透過係数
private var _t:Number = 0.6;
// コンストラクタ
public function AlphaAfterImage(bitmapData:BitmapData) {
super(bitmapData);
}
// 残像効果
override public function effect():void {
// アルファ値を減らす
alpha *= _t;
}
}
// ブラー残像
class BlurAfterImage extends AfterImage {
// 拡大率
private var _scaleRate:Number = 1.05;
// ブラー係数
private var _blurInc:Number = 3;
// ブラー
private var _blur:Number = 0;
// コンストラクタ
public function BlurAfterImage(bitmapData:BitmapData) {
super(bitmapData);
}
// 残像効果
override public function effect():void {
// 拡大
x -= width * (_scaleRate - 1) / 2;
y -= height * (_scaleRate - 1) / 2;
width *= _scaleRate;
height *= _scaleRate;
// ブラー
_blur += _blurInc;
var filter:BlurFilter = new BlurFilter(_blur, _blur, 1);
filters = [filter];
}
}
AfterImageSampleがメインクラスです。
メインクラス以外に4つのクラスを定義していて、
  • Chaserクラス
    moveToメソッドで指定した座標に対してバネの動きで接近するSprite
  • AfterImageクラス
    フレーム毎に変化し設定されたフレーム数に達したら消滅するSpriteで、残像をあらわすクラスの基底クラス。
  • AlphaAfterImageクラス
    AfterImageクラスを継承したクラスで、フレーム毎の変化はアルファ値の変更
  • BlurAfterImageクラス
    AfterImageクラスを継承したクラスで、フレーム毎の変化は拡大とBlurFiterの強さの変更
といった具合になっています。

AfterImageSampleクラスでは、コンストラクタでChaserクラスのインスタンスの生成とそのインスタンスをクリックしたときのイベントリスナの登録、フレームが進んだときのイベントリスナの登録をしています。

Chaserクラスのインスタンスのクリックに対するイベントハンドラでは、表示する残像の種類を示すフラグ(_isAlpha)を切り替えています。

フレームが進んだときのイベントハンドラでは、残像を発生する間隔を示す_intervalと前回の残像表示からの経過フレーム数を示す_intervalCntにしたがって残像を表示するかどうか判断しています。
残像を表示するタイミングでは、_isAlphaによってAlphaAfterImageクラスかBlurAfterImageクラスのインスタンスを生成しています。
この際、生成したインスタンスがChaserクラスのインスタンスよりも後ろに表示されるようにaddChildメソッドではなくaddChildAtメソッドを使用しています。

mxmlc -default-size 400 300 -default-frame-rate=24 -default-background-color=0x00CC66 AfterImageSample.as
なカンジでswfを生成しました。

テーマ:プログラミング - ジャンル:コンピュータ

2007.04.03 | | Comments(0) | Trackback(0) | Flex2

«  | HOME |  »

プロフィール

HundredthMonkey

Author:HundredthMonkey
プログラマ。

ブロとも申請フォーム

この人とブロともになる

メールフォーム

名前:
メール:
件名:
本文:

ブログ内検索


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。