Murayama blog.

プログラミング教育なブログ

フィルタ


もうちょっとでActionScript3.0アニメーションの第4章がおわる。
今日は終わるまでがんばる。つもり。


次はフィルタやってみます。


フィルタは、オブジェクトにエフェクトをかけるようなもん、と思っていいのかな。
理屈はいいとして、ぼかしをかけたり、影をつけたり、ベベルったりすることができます。


使い方はColorTransformのやり方とほとんど同じ。
DisplayObject(Spriteの親クラス)はfilterプロパティをもっているので、
そこにフィルタをセットしてやればOK。


これはBlurFilterの例。



コードはこんなかんじ。

package
{
  import flash.display.Sprite;
  import flash.filters.BlurFilter;
  
  public class Filters extends Sprite
  {
    public function Filters()
    {
      init();
    }
    
    private function init():void{
      var sprite:Sprite = new Sprite();
      sprite.graphics.lineStyle(2);
      sprite.graphics.beginFill(0xFFFF00);
      sprite.graphics.drawRect(100, 100, 100, 100);
      sprite.graphics.endFill();
      addChild(sprite);
      
      // フィルタは配列で指定する      
      var blur:BlurFilter = new BlurFilter(10, 10, 10);
      var filters:Array = [blur];
      sprite.filters = filters;
    }
  }
}


ついでにフィルタアニメーションもやってみた。
ここまでくるとちょっとASの面白さが出てきたように思う。


コード。

package
{
  import flash.display.Sprite;
  import flash.events.Event;
  import flash.filters.DropShadowFilter;
  
  public class AnimationFilters extends Sprite
  {
    private var filter:DropShadowFilter;
    private var sprite:Sprite
    
    public function AnimationFilters()
    {
      sprite = new Sprite;
      sprite.graphics.lineStyle(2);
      sprite.graphics.beginFill(0xFF0000);
      sprite.graphics.drawRect(-50, -50, 100, 100);
      
      sprite.x = 200;
      sprite.y = 200;
      addChild(sprite);
      // 影フィルター
      filter = new DropShadowFilter(0, 0, 0, 1, 20, 20, .3);
 
      addEventListener(Event.ENTER_FRAME, onEnterFrame);
    }
 
    private function onEnterFrame(evt:Event):void
    {
      // マウスと対象オブジェクトの距離を取得してフィルタに反映
      var dx:Number = mouseX - sprite.x;      
      var dy:Number = mouseY - sprite.y;
      filter.distance = Math.sqrt(dx * dx + dy * dy) / 10;
      
      // 影の表示角度を反映
      filter.angle = Math.atan2(dy, dx) * 180 / Math.PI;
      // 再設定しないと反映されない
      sprite.filters = [filter];
    }
  }
}

マウスとオブジェクトの距離、角度を演算して、
影の位置を調整しています。
これくらいならなんとか理解できる。今は。


おしまい。