Flex 2 の flash.filters パッケージ にはいろんなフィルタオブジェクトが用意されているので、Papervision3D でどうやって表示されるのか試してみた。

使ってみたフィルタは以下。

-GlowFilter
-BevelFilter
-BlurFilter
-ConvolutionFilter
-DropShadowFilter
-GradientBevelFilter
-GradientGlowFilter

フィルタ適用サンプル

オブジェクトをクリックすると別の効果を見れる。

ソースコード


package {
 
  import flash.display.*;
  import flash.events.*;
  import flash.filters.*;
  import flash.utils.*;
 
  import org.papervision3d.*;
  import org.papervision3d.core.proto.*;
  import org.papervision3d.scenes.*;
  import org.papervision3d.objects.*;
  import org.papervision3d.cameras.*;
  import org.papervision3d.materials.*;
 
  [SWF(width="400", height="400", backgroundColor="#000000", frameRate="30")]
 
  public class FiltersSample extends Sprite {
 
    private var container : Sprite;
    private var scene     : MovieScene3D;
    private var camera    : Camera3D;
 
    private var obj:Array = new Array();
 
   private var myFilters:Array = new Array();
   private var myFiltersNames:Array = new Array();
   private var myFiltersCounter:int = -1;
 
    // 3Dオブジェクト踊らせ用パラメータ
    private var valx    : Number = 0;
    private var valy    : Number = 0;
 
    public function FiltersSample():void {
 
      addEventListener(Event.ENTER_FRAME, onEnterFrame);
      addEventListener(MouseEvent.CLICK, onMouseClick);
      stage.addEventListener(Event.RESIZE, onStageResize);
 
      // 表示用の Sprite オブジェクトを生成
      container = new Sprite();
      container.x = 400 / 2; // at center : swf width  = 400
      container.y = 400 / 2; // at center : swf height = 400
      addChild(container);
 
      // シーンオブジェクトを作る
      scene = new MovieScene3D(container);
 
      // カメラオブジェクトを作る
      camera = new Camera3D();
      camera.z = -300;
      camera.focus = 500;
      camera.zoom = 1;
 
      scene.addChild(createPlane(), "textboard");
 
      // いろんな3Dオブジェクトを作ってみて、配列に入れておく
      obj.push();
      obj.push(createCube());
      obj.push(createSphere());
 
      // 3Dオブジェクトをルートノードに追加
      for(var i:int; i<obj.length; i++){
        scene.addChild(obj[i]);
      }
 
      // いろんなフィルタ
      myFilters.push(new Array());
      myFiltersNames.push("No Filters.");
      myFilters.push(createGlowFilters1());
      myFiltersNames.push("GlowFilters1");
      myFilters.push(createGlowFilters2());
      myFiltersNames.push("GlowFilters2");
      myFilters.push(createBevelFilters());
      myFiltersNames.push("BevelFilter");
      myFilters.push(createBlurFilters());
      myFiltersNames.push("BlurFilter");
      myFilters.push(createConvolutionFilters());
      myFiltersNames.push("ConvolutionFilters");
      myFilters.push(createDropShadowFilters());
      myFiltersNames.push("DropShadowFilter");
      myFilters.push(createGradientBevelFilters());
      myFiltersNames.push("GradientBevelFilter");
      myFilters.push(createGradientGlowFilters());
      myFiltersNames.push("GradientGlowFilter");
 
      setFilters();
    }
 
    private static function createGlowFilters1():Array {
      var filters:Array = new Array();
      filters.push(new GlowFilter(0xFFFFFF, 0.5, 20, 20, 2, BitmapFilterQuality.HIGH, false, false));
      return filters;
    }
 
    private static function createGlowFilters2():Array {
      var filters:Array = new Array();
      filters.push(new GlowFilter(0xFFFFFF, 0.5, 20, 20, 2, BitmapFilterQuality.HIGH, false, false));
      filters.push(new GlowFilter(0xFFFFFF, 1, 40, 40, 2, BitmapFilterQuality.HIGH, true, false));
      return filters;
    }
 
    private static function createConvolutionFilters():Array {
      return [new ConvolutionFilter(5,5,[0,0,0,0,0,0,1,1,0,0,0,1,0,-1,0,0,0,-1,-1,0,0,0,0,0,0],1,128)];
    }
 
    private static function createBevelFilters():Array {
      var filters:Array = new Array();
      filters.push(new BevelFilter(10.0, 45.0, 0xFF00FF, 0.5, 0xFFFF00, 0.8, 3.0, 3.0, 0.5, BitmapFilterQuality.HIGH, BitmapFilterType.INNER, false));
      return filters;
    }
 
    private static function createBlurFilters():Array {
      var filters:Array = new Array();
      filters.push(new BlurFilter(4.0, 4.0, BitmapFilterQuality.HIGH));
      return filters;
    }
 
    private static function createDropShadowFilters():Array {
      var filters:Array = new Array();
      filters.push(new DropShadowFilter(4.0, 45.0, 0xFFFF00, 0.5, 4.0, 4.0, 1.0, BitmapFilterQuality.HIGH, false, true, false));
      return filters;
    }
 
    private static function createGradientBevelFilters():Array {
      var filters:Array = new Array();
      var f:GradientBevelFilter = new GradientBevelFilter();
      f.colors = [0xFFFF00, 0xFFFFFF, 0xFF0000];
      f.alphas = [1, 0.25, 1];
      f.ratios = [64, 128, 255];
      filters.push(f);
      return filters;
    }
 
    private static function createGradientGlowFilters():Array {
      var filters:Array = new Array();
      var f:GradientGlowFilter = new GradientGlowFilter();
      f.colors = [0xFF0000, 0xFFFF00, 0x999999];
      f.alphas = [0.25, 0.5, 1];
      f.ratios = [64, 128, 255];
      filters.push(f);
      return filters;
    }
 
    private static function createPlane():DisplayObject3D {
 
      var material:TextMaterial = new TextMaterial();
      var width:Number  = 300;
      var height:Number =  50;
 
      var obj:Plane = new Plane(material, width, height);
      obj.x = 0;
      obj.y = 0;
      obj.z = -100;
      return obj;
    }
 
    private static function createCube():DisplayObject3D {
 
      var material:ColorMaterial = new ColorMaterial(0x00FF00);
      var width:Number  = 300;
      var depth:Number  = 100;
      var height:Number = 200;
      var segmentsS:Number = 5;
      var segmentsT:Number = 5;
      var segmentsH:Number = 5;
 
      var obj:Cube = new Cube(material, width, depth, height, segmentsS, segmentsT, segmentsH);
      obj.x = -150;
      obj.y = 0;
      obj.z = 0;
      return obj;
    }
 
    private static function createSphere():DisplayObject3D {
 
      var material:ColorMaterial = new ColorMaterial(0x00FF00);
      var radius:Number  = 200;
      var segmentsW:int = 24;
      var segmentsH:int = 24;
 
      var obj:Sphere = new Sphere(material, radius, segmentsW, segmentsH);
      obj.x = 150;
      obj.y = 0;
      obj.z = 0;
      return obj;
    }
 
    private function setFilters():void{
 
      myFiltersCounter++;
      if(myFiltersCounter > myFilters.length - 1){
        myFiltersCounter = 0;
      }
 
      for(var i:int; i<obj.length; i++){
        obj[i].container.filters = myFilters[myFiltersCounter];
      }
 
      var tm:TextMaterial = scene.getChildByName("textboard").material as TextMaterial;
      tm.text = myFiltersNames[myFiltersCounter];
    }
 
    private function onMouseClick(event:MouseEvent):void {
      setFilters();
    }
 
    private function onEnterFrame(event:Event):void {
 
      valx += container.mouseX / 100;
      valy += container.mouseY / 100;
 
      for(var i:int; i<obj.length; i++){
        obj[i].rotationY = valx;
        obj[i].rotationX = valy;
      }
 
      scene.renderCamera(camera);
    }
 
    private function onStageResize(event:Event):void {
      container.x = stage.stageWidth  / 2;
      container.y = stage.stageHeight / 2;
    }
 
  }
}

テキスト表示用のマテリアル: TextMaterial.as


package {
 
  import flash.display.*;
  import flash.events.*;
  import flash.text.*;
 
  import org.papervision3d.core.proto.*;
  import org.papervision3d.scenes.*;
  import org.papervision3d.objects.*;
  import org.papervision3d.cameras.*;
  import org.papervision3d.materials.*;
 
  public class TextMaterial extends MovieMaterial {
 
    private var textField:TextField;
    private var textFormat:TextFormat;
 
    public function TextMaterial(field:TextField = null, format:TextFormat = null):void {
 
      if(field == null){
         field = createTextField();
      }
      textField = field;
 
      if(format == null){
         format = createTextFormat();
      }
      textFormat = format;
 
      textField.text = "                    ";
      textField.setTextFormat(textFormat);
 
      var asset:MovieClip = new MovieClip();
      asset.addChild(textField);
 
      var transparent:Boolean = true;
      var initObject:Object = {animated:true, doubleSided:true};
 
      super(asset, transparent, initObject);
    }
 
    public function get text():String{
      return textField.text;
    }
 
    public function set text(value:String):void{
      textField.text = value;
      super.updateBitmap();
    }
 
    private static function createTextField():TextField {
 
      var text:TextField = new TextField();
      text.autoSize = TextFieldAutoSize.CENTER;
      text.selectable = false;
      text.background = false;
      //text.backgroundColor = 0x000000;
      text.border = false;
      text.borderColor = 0xFFFFFF;
      text.textColor = 0xFFFFFF;
 
      return text;
    }
 
    private static function createTextFormat():TextFormat {
      var format:TextFormat = new TextFormat();
      format.bold = false;
      format.italic = false;
      format.size = 12;
      format.underline = false;
      format.font = "_等幅";
      return format;
    }
 
  }
}

参考

tags: zlashdot Flash Flash Flex Papervision3D

Posted by NI-Lab. (@nilab)