2011-10-17 4 views
0

フレックスとActionScriptの新機能です。パネル上に矩形を動的に作成できるだけのアプリケーションを作成しようとしています。マウスの移動イベント(左ボタンが押された状態)で更新されると、四角形はマウスで上に移動します。イベントの問題(検出されません)

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" 
         width="550" height="400" 
         creationComplete="this.onCreationComplete(event);"> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.graphics.SolidColor; 

      import spark.primitives.Graphic; 
      import spark.primitives.Rect; 

      public static const WIDTH:int = 480; 
      public static const HEIGHT:int = 300; 
      public static const BACKGROUND:int = 0xEFEFEF; 
      public static const CURRENT_FILL:SolidColor = new SolidColor(0x00AA00, 0.75); 

      protected var rectangles:ArrayCollection = null; 

      protected var currentRect:Rect = null; 
      protected var dragging:Boolean = false; 

      protected function onCreationComplete(event:FlexEvent):void 
      { 

       this.rectangles = new ArrayCollection(); 

       this.sprite.graphics.beginFill(BACKGROUND); 
       this.sprite.graphics.drawRect(0, 0, this.sprite.width, this.sprite.height); 
       this.sprite.graphics.endFill(); 

       this.sprite.addEventListener(MouseEvent.MOUSE_DOWN, this.onMouseDown); 
       this.sprite.addEventListener(MouseEvent.MOUSE_UP, this.onMouseUp); 

      } 

      protected function onMouseDown(event:MouseEvent):void 
      { 

       this.currentRect = new Rect(); 
       this.currentRect.y = 10; 
       this.currentRect.height = this.sprite.height - (10 * 2); 

       this.currentRect.x = event.localX; 
       this.currentRect.width = 1; 

       this.panel.addElement(this.currentRect); 

       this.dragging = true; 

       this.sprite.addEventListener(MouseEvent.MOUSE_MOVE, this.onMouseMove); 

      } 

      protected function onMouseUp(event:MouseEvent):void 
      { 
       if (this.dragging) 
       { 

        this.sprite.removeEventListener(MouseEvent.MOUSE_MOVE, this.onMouseMove); 


        this.rectangles.addItem(this.currentRect); 
        this.dragging = false; 

       } 
      } 

      protected function onMouseMove(event:MouseEvent):void 
      { 
       if (this.dragging) 
       { 
        this.currentRect.width = event.localX - this.currentRect.x;  
       } 
      } 

     ]]> 
    </fx:Script> 

    <s:Panel id="panel" x="10" y="10" title="Calendar"> 
     <s:SpriteVisualElement id="sprite" width="{WIDTH}" height="{HEIGHT}" /> 
    </s:Panel> 

</s:WindowedApplication> 

すべてが正常に動作しますが、今、私はいくつかのアクションを実行したいときに、ユーザーがクリック(またはダブルクリック、または何をしたい)の長方形に。私は各矩形にイベントを追加しようとしましたが(onMouseUpにthis.currentRect.addEventListener(MouseEvent.DOUBLE_CLICK、myMethod)が追加されました)、対応するメソッドは決して実行されません。

何が問題なのですか?

答えて

0

グラフィックスAPIで描画されるオブジェクトは、イベントディスパッチャではありません。そのため、addElementを使用して、グラフィックスパイを使用してシェイプを描画するのではなく、作成しているスパークのプリミティブ矩形を(グループなどのコンテナに)何も使用しないで追加します。

ただし、ArrayCollectionにバインド可能なデータオブジェクトが多数含まれていて、itemRenderersでデータグループを使用してデータを表示する方がよい場合があります。

+0

ありがとうございました!実際には、グラフィックスAPIを使って背景にいくつかの図形を描いています(私はこれらの図形とやりとりする必要はありません)が、私の 'onMouseDown'メソッドで見ることができるように、Sparkプリミティブ矩形を作成してパネルは 'addElement'を使用しています... – jroy

+0

ああ。私はあなたが今何をしているのかを見ます。リスナーを要素として追加する前にリスナーを追加して、各Rectに対して個別の表示オブジェクトを持たせたいという「ヒント」をプレイヤーに与えてください(Rectはマウスイベントを受け取ることはできません)。それでも問題が解決しない場合は、私が提案したようにDataGroupを使用してください。そうすれば、MXMLを通してすべてを行うことができます。 –

+0

OK私は、Rectsがマウスイベントを受け取ることができないことを知りませんでした。私は以前にリスナーを追加しようとしましたが、うまくいかなかった...私はあなたまたはトゥースダンが提案したものを試してみると思います。 – jroy

0

コレクションに描画した矩形を追跡し、マウスクリック時に矩形でヒットテストを行い、矩形がクリックされているかどうかを判断できます。

関連する問題