AS3 drawTrianglesをやってみる « きんくまデザイン

AS3 drawTrianglesをやってみる

2009/04/17

3Dまわりのこととかを勉強してました。

で、この本を見ながら作ったのがこれです。

この本読んだことのない人のために解説しますと、1/3ぐらいを使って3Dの基礎を解説してくれています。以前に流し読みでさらっと見ただけだったんですが、もう一度1から書いてみようということで練習してました。
書いてみることで、スクリーンと焦点距離・zの関係と、スクリーンを中心とした座標というのがわかった気がします。
なんとなくわかったつもりだったときは、自分の視点を中心にまわってるように勘違いしてました。

で、話はとんで、wonderflの花火のすごいデモを解析しようとしたんですが、
→すごいデモ
このデモ、Player10の機能をかなり使ってるんですね。PerspectiveProjection, Matrix3D, Vector3D, Utils3Dなど。
Player10じゃないのも混じっているかも。それで、さっぱりわからん状態です。なので、もう少しこのPlayer10まわりの新機能やPV3dなんかも勉強しようと思っているところです。

とりあえず、drawTrianglesだ。ということで野中先生のこれを参考に作ってみました。
第二引数のところがわかりやすかったです。

三角形分割によるテクスチャマッピング −

ソースはこんな感じです。

package
{
  import flash.display.BitmapData;
  import flash.display.Sprite;
  import flash.events.Event;
  import flash.events.MouseEvent;
  import flash.geom.Point;
  import flash.utils.getDefinitionByName;

  public class Main3 extends Sprite
  {
    public var points:Array;
    public var bmd:BitmapData;
    public var vertices:Vector.<Number> = new Vector.<Number>();
    public var indices:Vector.<int> = new Vector.<int>();
    public var uvtData:Vector.<Number> = new Vector.<Number>();
    public var sp:Sprite;
    public var activeVertex:Sprite;

    public function Main3()
    {
      points = new Array(new Point(0,0), new Point(200, 0), new Point(200, 200), new Point(0, 200));

      sp = new Sprite();
      var Car:Class = getDefinitionByName("CAR") as Class;
      bmd = new Car(0, 0);


      indices.push(0, 1, 2);
      indices.push(0, 2, 3);
      uvtData.push(0, 0, 1, 0, 1, 1, 0, 1);

      this.addChild(sp);
      sp.x += 10;
      sp.y += 10;

      this.drawPoints();
      this.setVertex();
    }

    public function drawPoints(e:Event = null):void
    {
      if (activeVertex != null) {
        var no:int = parseInt(activeVertex.name.substr("vertex".length));
        points[no].x = activeVertex.x;
        points[no].y = activeVertex.y;
      }
      vertices = new Vector.<Number>();
      for (var i:int = 0; i < points.length; i++) {
        vertices.push(points[i].x, points[i].y);
      }
      sp.graphics.clear();
      sp.graphics.beginBitmapFill(bmd);
      sp.graphics.drawTriangles(vertices, indices, uvtData);
      sp.graphics.endFill();
    }

    public function setVertex():void
    {
      var i:int;
      for (i = 0; i < points.length; i++) {
        var vertexSP:Sprite = new Sprite();
        this.addChild(vertexSP);
        vertexSP.x = this.points[i].x;
        vertexSP.y = this.points[i].y;
        vertexSP.graphics.beginFill(0xff0000, 1);
        vertexSP.graphics.drawCircle(10, 10, 10);
        vertexSP.graphics.endFill();
        vertexSP.name = "vertex" + i.toString();
        vertexSP.addEventListener(MouseEvent.MOUSE_DOWN, vertexDownHD);
        vertexSP.buttonMode = vertexSP.useHandCursor = true;
      }
    }

    public function vertexDownHD(e:MouseEvent):void
    {
      activeVertex = e.currentTarget as Sprite;
      activeVertex.startDrag();
      var self:Main3 = this;
      this.stage.addEventListener(Event.ENTER_FRAME, this.drawPoints);
      this.stage.addEventListener(MouseEvent.MOUSE_UP, function(e:Event) {
        activeVertex.stopDrag();
        self.stage.removeEventListener(Event.ENTER_FRAME, self.drawPoints);
        self.stage.removeEventListener(MouseEvent.MOUSE_UP, arguments.callee);
        self.drawPoints();
      });
    }
  }

}