Flashの最近のブログ記事

今までこのブログは、Firefoxで書いて、Firefoxで確認していたら、


IEでは、flashが見れていなかったらしく、お詫び申し上げます


id:mongchang曰く、Objectタグがダメらしく、今朝Papervision系は直しました。

IE6, Firefox, Opera, Sleipnir, Safariで、一応確認しました。

Google Analyticsによると、約半数がIEということで、

多くの人が見れずにいたのかぁって思うとちょっと残念。



リンクを貼っておくので、

思いたる節がある人は、見に来てください。


・[Papervision3D2.0]#1GreatWhiteを使ってみる
・[Papervision3D2.0]#2 GreatWhiteでMouseEventを使うなどしてみる
・[Papervision3D2.0]#3 Tweenerでトゥィ―――ンする
・[Papervision3D2.0]#4 PV2.0でGlowFilterを使う
・[Flex][Air] BlurFilterでぼかす



次以降、flashを貼る時のためのテンプレ
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" id="externalFlash" align="middle" height="縦幅" width="横幅" > 　　<param name="movie" value="swfのURL" /> 　　<param name="bgcolor" value="#CCCCCC" /><param name="base" value="." /> 　　<embed src="swfのURL" base="." bgcolor="#CCCCCC" name="externalFlash" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" align="middle" height="縦幅" width="横幅" > </object>

Papervison3D2.0でGlowFilterを使う時のメモ

まず、GreatWhiteでは使えない（たぶん
なので、GreatWhiteではなくEffectsの方を使う。

FilterはGlowFilterじゃなくてもいいはずだけど、使ったことないからわかんない

ぇっと、前回の[Papervision3D2.0]#3 Tweenerでトゥィ―――ンするのマウスオーバーしたPlaneを光らせるようにする。





ソース（ myGlowFilter.mxml)

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()" width="600" height="300"> <mx:Script> <![CDATA[ import org.papervision3d.events.InteractiveScene3DEvent; import org.papervision3d.core.effects.LayerEffect; import org.papervision3d.core.layers.EffectLayer; import flash.events.MouseEvent; import flash.events.Event; import org.papervision3d.materials.ColorMaterial; import org.papervision3d.objects.primitives.Plane; import org.papervision3d.objects.DisplayObject3D; import org.papervision3d.cameras.FreeCamera3D; import mx.core.UIComponent; import org.papervision3d.render.BasicRenderEngine; import org.papervision3d.view.Viewport3D; import org.papervision3d.scenes.Scene3D; import caurina.transitions.Tweener; private var myScene:Scene3D; private var myCamera:FreeCamera3D; private var myViewport:Viewport3D; private var myRenderer:BasicRenderEngine; private var rootNode:DisplayObject3D; private var effectLayer:EffectLayer; private function init():void{ //ＵＩコンポーネント作成 var myNestingComponent:UIComponent = new UIComponent(); addChild(myNestingComponent); myViewport = new Viewport3D(600, 300, false, true); myNestingComponent.addChild(myViewport); setup(); this.addEventListener(Event.ENTER_FRAME, renderLoop);//イベントリスナー登録 // MouseEvent① this.addEventListener(MouseEvent.MOUSE_UP, onMouseUp); this.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown); } private function setup():void{ myScene = new Scene3D(); //シーン生成 myRenderer = new BasicRenderEngine(); //レンダリング専用クラス myCamera = new FreeCamera3D; //カメラオブジェクト生成 myCamera.zoom = 3; //カメラズーム myCamera.focus = 500; //カメラフォーカス rootNode = new DisplayObject3D("rootNode"); //ルートノード myScene.addChild(rootNode); // エフェクト effectLayer = new EffectLayer(); effectLayer.addEffect(new LayerEffect(new GlowFilter(0xFFFFFF, 1, 16, 16, 3, 3, false, false))); myViewport.addRenderLayer(effectLayer); var color:Array = [0xffa8a8, 0xffa8d3, 0xffa8ff, 0xd3a8ff, 0xa8a8ff, 0xa8d3ff, 0xa8ffff, 0xa8ffd3, 0xa8ffa8, 0xd3ffa8, 0xffffa8, 0xffd3a8]; var material:Array = new Array(); for(var index:int = 0; index < color.length; index++) { var cm:ColorMaterial = new ColorMaterial(color[index]); cm.interactive = true; material.push(cm); } for(index = 0; index < 50; index++) { var plane:Plane = new Plane(material[index%material.length], 150, 150); plane.x = 200 * index - 5000; plane.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, onMouseOver); plane.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, onMouseOut); rootNode.addChild(plane); } } // マウスオーバーイベント private function onMouseOver(e:InteractiveScene3DEvent):void { DisplayObject3D(e.target).renderLayer = effectLayer; } private function onMouseOut(e:InteractiveScene3DEvent):void { DisplayObject3D(e.target).renderLayer = null; } //回転してレンダリング private function renderLoop(myEvent:Event):void{ if(isMouseDown) { var dx:int = (myViewport.mouseX - mouseDownedX); Tweener.addTween(rootNode, {x:rootNode.x - dx*6, time:3, transition:"easeOut"}); Tweener.addTween(myCamera, {rotationY: dx, time:1, transition:"easeOut"}); } else { Tweener.addTween(myCamera, {rotationY: 0, time:3, transition:"easeOut"}); } myRenderer.renderScene(myScene, myCamera, myViewport); } private var isMouseDown:Boolean; private var mouseDownedX:int; private var mouseDownedY:int; private function onMouseDown(e:Event):void { isMouseDown = true; mouseDownedX = myViewport.mouseX; mouseDownedY = myViewport.mouseY; } private function onMouseUp(e:Event):void { isMouseDown = false; } ]]> </mx:Script> </mx:Application>


GlowFilter自体はどのオブジェクトにマウスオーバーしても同じにするので、インスタンスは一度だけnewしてそれを使いまわす。
// エフェクト effectLayer = new EffectLayer(); effectLayer.addEffect(new LayerEffect(new GlowFilter(0xFFFFFF, 1, 16, 16, 3, 3, false, false))); myViewport.addRenderLayer(effectLayer);


これをMouseOverした時に適用するには、renderLayerプロパティにこれを代入するだけ
// マウスオーバーイベント private function onMouseOver(e:InteractiveScene3DEvent):void { DisplayObject3D(e.target).renderLayer = effectLayer; } private function onMouseOut(e:InteractiveScene3DEvent):void { DisplayObject3D(e.target).renderLayer = null; }


MouseEvent(InteractiveScene3DEvent)を有効にするのに、cameraとmaterialのinteractiveプロパティをtrueにするのを忘れずに（[Papervision3D2.0]#2 GreatWhiteでMouseEventを使うなどしてみる）
myViewport = new Viewport3D(600, 300, false, true); cm.interactive = true;

Javaには、Class.forName(String className)というメソッドがあり、指定したクラス名のClassオブジェクトを返すstaticメソッドがありますが、flexでもそれがないか探してみました。

すると
var cls:Class = flash.util.getClassByName("ClassName"); var myObj:Object = new cls();

というプログラムが見つかった。

また、次に次のようなプログラムも見つかった。
var clazz:Class = flash.utils.getDefinitionByName("ClassName") as Class; var instance:Object = new clazz();

さらには、次のようなものも
var clazz:Class = var classRef:Class = view.systemManager.getDefinitionByName("ClassName") as Class;


まだちゃんと検証とかまで手が回ってないので、出来次第まとめます。
今回はとりあえずメモでー


＜参考＞
Flex2 リファレンスガイド (http://livedocs.adobe.com/flex/201_jp/langref/)
Java 5 と ActionScript 3 の構文比較 (http://d.hatena.ne.jp/flashrod/20061212)
Flex User Group(http://www.fxug.net/modules/xhnewbb/viewtopic.php?topic_id=1241)
アプリケーションレベルのMVC [FLEX2] (http://blog.so-net.ne.jp/yoshimoto/2006-12-24)

以前、3ds maxにColladaMAXプラグインを用いてdae形式のファイルを出力し、Papervision3dでそれを表示させるという方法を紹介したが、今回はAS3 Geom Class ExporterというMaxScriptを用いてActionScript3.0形式のファイルにして使用してみた。


オブジェクトの設定とかUVマップとかは、今までの[Papervision3d]#4 3ds maxでモデリングしたデータをColladaを使って表示する①の1～20や、[Papervision3d]#6 ライト・影をテクスチャによって表現の(1)～(3)を参照。


出来たオブジェクトをActionScript3.0で保存するほう為には、

(1) AS3 Geom Class Exporterをダウンロードする。
AS3 Geom Class Exporterはshirotokoroさんのブログの、ここでダウンロードできます。
Download demo sources and 3ds max scriptからダウンロードしたら、ファイルを解凍

(2) 3ds maxからAS3 Geom Class Exporterを実行できるようにする
3ds maxの画面右から、ユーティリティのタブをクリックし、MAXScriptを選択し、スクリプトを実行をクリック






































(1)で解凍したフォルダの、AS3GeomClassExporter.msファイルを実行


(3) AS3 Geom Class Exporterでファイルを出力
ユーティリティーと書かれているセレクトボックスからAS3 Geom Class Exporterを選択すると下に、AS3 Geom Class Exporterの画面が出るEngineをPapervision3d1.5に指定し、ExportClass


































これで、指定したクラス名(ここではMyObject)でファイルが出力される。




これを扱うためのソースはMAXScriptと一緒に入っているデモに書かれているので、とりあえずはそれを使う。



単に表示するとかなら、Collada形式でもAS3.0形式でも出来るが、AS3.0のようにクラス化されていると、昔書いた[Papervision3d]#3 複数のオブジェクトに異なったイベントリスナーを付けてみるのように、マウスイベントとかも細かく記述できるからこっちの方が便利かも


↓は実際にAS3 Geom Class Exporterで出力したファイルを表示させたもの

最近、ブログの更新が滞ってて申し訳ない。まぢレポート出すぎ・・・


さて、今回は、Papervision3d × 3ds maxで表示させるオブジェクトに影をつける為の方法をメモっておく
私の調べた限りでは、Papervision3dに"ライト"という概念がない

そこで、UVWマップのテクスチャを使って影っぽいものを表現する



やり方は、
(1) オブジェクトをモデリング
(2) ライトを設定し、テクスチャをレンダリングし、画像ファイルとして保存
(3) 出力したテクスチャをUVWアンラップ
(4) オブジェクトをCollada(.dae)ファイルで出力
である。



(1) オブジェクトをモデリング
サイコロも飽きてきた頃なので、最近モデリングしたヴァイオリンを使うことにした


(2) ライトを設定し、テクスチャをレンダリングし、画像ファイルとして保存
作成のライトのスカイライトを選び、影付けにチェックをし、床に置く


























































参考サイト
ricardocabello　How to render the illumination to a texture for Papervision3D with 3D Studio MAX