Papervision3D の BitmapMaterial と MovieMaterial の使用例サンプル。
テキストを3D空間でグリグリさせる(text animation?)ために MovieMaterial-MovieClip-TextField を使っている。
いくつかの挙動を確認するため、クリックするといろいろするようにしてみた。
・MovieMaterial の背景透明/背景不透明の変更。
・BitmapMaterial 上に描画。
ソースコード(MaterialSample.as)
Flex + Papervision3D でコンパイル。
package {
import flash.display.*;
import flash.events.*;
import flash.geom.*;
import flash.text.*;
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")]
// BitmapMaterial と MovieMaterial (テキスト表示) のサンプル
public class MaterialSample extends Sprite {
private var container : Sprite;
private var scene : Scene3D;
private var camera : Camera3D;
private var rootNode : DisplayObject3D;
private var obj:Array = new Array();
// 3Dオブジェクト踊らせ用パラメータ
private var valx : Number = 0;
private var valy : Number = 0;
// Bitmap
private var bitmapdata:BitmapData;
// Text
private var text:TextField;
private var material:MovieMaterial
public function MaterialSample():void {
// 画面いっぱいに表示(縦横比無視)したいときはコレを使う
// stage.scaleMode = StageScaleMode.EXACT_FIT;
// リサイズに対応(swfをブラウザで直接ひらいているときとか)
stage.addEventListener(Event.RESIZE, onStageResize);
// 定期的にイベント発生
addEventListener(Event.ENTER_FRAME, myLoopEvent);
// マウスクリックでイベント発生
stage.addEventListener(MouseEvent.CLICK, myClick);
// 表示用の 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 Scene3D(container);
// カメラオブジェクトを作る
camera = new Camera3D();
camera.z = -200;
camera.focus = 500;
camera.zoom = 1;
// ルートノードを作る
rootNode = new DisplayObject3D();
scene.addChild(rootNode);
// いろんな3Dオブジェクトを作ってみて、配列に入れておく
obj.push(createWireframePlane());
obj.push(createBitmapPlane());
obj.push(createTextPlane());
obj.push(createTextCube());
// 3Dオブジェクトをルートノードに追加
for(var i:int; i<obj.length; i++){
rootNode.addChild(obj[i]);
}
}
private function createWireframePlane():DisplayObject3D {
var material:WireframeMaterial = new WireframeMaterial();
material.oneSide = false;
material.lineColor = 0x00FF00;
material.lineAlpha = 1;
var planeSize:int = 200;
var segment:int = 2;
var plane:Plane = new Plane(
material, planeSize, planeSize, segment, segment);
plane.x = 0;
plane.y = 180;
plane.z = 0;
return plane;
}
private function createBitmapPlane():DisplayObject3D {
var bd:BitmapData = new BitmapData(100, 100, false);
this.bitmapdata = bd; // using this
var material:BitmapMaterial = new BitmapMaterial(bd);
material.oneSide = false;
material.lineColor = 0x00FF00;
material.lineAlpha = 1;
var planeSize:int = 200;
var segment:int = 2;
var plane:Plane = new Plane(
material, planeSize, planeSize, segment, segment);
plane.x = -180;
plane.y = 0;
plane.z = 0;
return plane;
}
private function createTextPlane():DisplayObject3D {
var asset:MovieClip = createMovieClip();
var transparent:Boolean = true;
var initObject:Object = {animated:true, doubleSided:true};
var material:MovieMaterial = new MovieMaterial(asset, transparent, initObject);
this.material = material; // using this
var planeSize:int = 200;
var segment:int = 2;
var plane:Plane = new Plane(
material, planeSize, planeSize, segment, segment);
plane.x = 180;
plane.y = 0;
plane.z = 0;
return plane;
}
private function createTextCube():DisplayObject3D {
var planeSize:int = 200;
var segment:int = 2;
// using this
var cube:Cube = new Cube(
this.material, planeSize, planeSize, planeSize, segment, segment, segment);
cube.x = 0;
cube.y = 0;
cube.z = 0;
return cube;
}
private function createMovieClip():MovieClip {
var mc:MovieClip = new MovieClip();
var text:TextField = createTextField();
text.text = getPropertiesString(mc);
mc.addChild(text);
this.text = text; // using this
return mc;
}
private static function createTextField():TextField{
// 表示メッセージのスタイル
var format:TextFormat = new TextFormat();
format.bold = false;
format.italic = false;
format.size = 10;
format.underline = false;
format.font = "_等幅";
// 表示メッセージ
var text:TextField = new TextField();
text.autoSize = TextFieldAutoSize.LEFT;
text.selectable = false;
text.setTextFormat(format);
text.background = true;
text.backgroundColor = 0x000000;
text.border = false;
text.borderColor = 0xFFFFFF;
text.textColor = 0xFFFFFF;
return text;
}
// 最初だけこんなの表示してみる
private static function getPropertiesString(mc:MovieClip):String {
var str:String = ""
+ "currentFrame: " + mc.currentFrame + "\n"
+ "currentLabel: " + mc.currentLabel + "\n"
+ "currentScene: " + mc.currentScene + "\n"
+ "framesLoaded: " + mc.framesLoaded + "\n"
+ "totalFrames: " + mc.totalFrames + "\n"
+ "trackAsMenu: " + mc.trackAsMenu + "\n";
return str;
}
private function myClick(event:MouseEvent):void {
// update Bitmap
// Math.random: (0 <= n < 1)
var x:int = (int)(Math.random() * 100);
var y:int = (int)(Math.random() * 100);
// bitmapdata.setPixel(x, y, 0xFF0000);
var rect:Rectangle = new Rectangle(x, y, 20, 20);
bitmapdata.fillRect(rect, 0xFF0000);
// update Text
text.border = !text.border; // ワクを付けたり消したり
text.background = !text.background; // 背景を付けたり消したり
text.text = "マウスを\nクリックした位置:\nLocation(" + container.mouseX + "," + container.mouseY + ")";
material.updateBitmap(); // 更新を通知
//scene.renderCamera(camera);
}
private function myLoopEvent(event:Event):void {
valx += container.mouseX / 50;
valy += container.mouseY / 50;
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;
}
}
}
tags: zlashdot Flash Flash Flex Papervision3D
Posted by NI-Lab. (@nilab)