Canvasレイアウトのドラッグ・サンプルソース

現在開発中のプロジェクトで、Canvasレイアウトをマウスでドラッグ移動させる必要があったのでテストプログラムを作成しました。忘れないようにFlex備忘録として残します。

Canvasレイアウトをマウスでドラッグして移動する。

・スクリプトの抜粋

    // マウスボタンダウン
    private function mouseDownHandler(event:MouseEvent):void {
      canvasX = mindcanvas.mouseX;
      canvasY = mindcanvas.mouseY;
      mapX = mindmapView.x;
      mapY = mindmapView.y;
      //trace("mouseDownHandler()実行！ (cx,cy,vx,vy)=["+canvasX+","+canvasY+","+mapX+","+mapY+"]");
    }

    // マウス移動(ドラッグ)
    private function mouseMoveHandler(event:MouseEvent):void {
      if (!event.buttonDown) return;
      mindmapView.x = mindcanvas.mouseX - canvasX + mapX;
      mindmapView.y = mindcanvas.mouseY - canvasY + mapY;
      //trace("mouseMoveHandler()実行！ (x,y)=["+mindmapView.x+","+mindmapView.y+"]");
    }

・ＭＸＭＬ定義から抜粋

    <mx:Canvas id="mindcanvas" width="100%" height="100%" styleName="mindBox"
        mouseDown="mouseDownHandler(event)"
        mouseMove="mouseMoveHandler(event)">
      <MyComp:MindMapView id="mindmapView" />
    </mx:Canvas>

これでCanvasレイアウトに描いたグラフィックをマウスでドラッグ移動させることはできたのだが、まだ動きが重い感じです。見直す必要がありそうです！