FLEX3, Capture et événement, cas particulier

Question

Voici mon problème:

J'ai un tableau noir dans un panneau, cette toile a elle-même plusieurs enfants, comme une barre d’outils (tuiles), une étiquette et un skinning.

Le problème est que lorsque je passe à l'outil Rectangle et que je commence à dessiner des rectangles si je souhaite changer d'outil lorsque je clique sur un autre outil tel que "Cercle" ou "Sélection", le bouton n'enregistre pas le clic. événement, au lieu de la toile va attraper la souris et commencer à dessiner.

Comme sur la photo. Je suis donc incapable de changer d'outil une fois que je commence à dessiner.

texte alt http://www.freeimagehosting.net/uploads/397a7cd49e.png

Comment pourrais-je ne pas faire réagir la toile quand il est sur un outil, ou comment puis-je faire en sorte que le bouton attrape le clic d'abord et dis à la toile de ne rien dessiner?

Bien sûr, je pourrais simplement placer la barre d’outils ailleurs que sur le canevas, mais comme l’espace est important, j’aimerais que les boutons soient sur le canevas.

Je suis ouvert à toute suggestion.

=== Voici du code pour montrer comment cela fonctionne en interne. ===

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" 
          xmlns:degrafa="http://www.degrafa.com/2007"
          xmlns:comp="org.foo.bar.view.components.*"
          layout="absolute"
          title="Tableau">


    <mx:Script>
    <![CDATA[
        import org.edorado.edoboard.ApplicationFacade;
    ]]>
    </mx:Script>

    <mx:Canvas id="blackBoard">

        <degrafa:Surface id="boardSurfaceContainer">
             skinning      
     </degrafa:Surface>

        <!-- Tool bar -->
        <comp:ToolbarView 
           id = "toolbar"
           name = "toolbar"
           verticalScrollPolicy="off" 
           horizontalScrollPolicy="off"
           bottom="5"
           right="5"
           top="5"
           direction="vertical"
           width="30" />   

        <mx:Label x="10" y="10" text="Label"  color="#FFFFFF" id="lbl"/>

    </mx:Canvas>

</mx:Panel>

La barre d’outils est une liste de boutons contenus dans une tuile. Le "tableau noir" de la toile est lié à plusieurs événements, notamment la souris vers le haut et le déplacement pour dessiner des formes.

...
boardCanvas.addEventListener(MouseEvent.MOUSE_DOWN, handleMouseDown);
            boardCanvas.addEventListener(MouseEvent.MOUSE_UP, handleMouseUp);
...
        private function handleMouseDown(event:MouseEvent):void {
            // Get the current mouse location wich may be adjusted to the grid
            var selectPoint:Point = boardCanvas.globalToLocal(new Point(event.stageX, event.stageY));
            startPoint = snapPoint(selectPoint.x, selectPoint.y);
            boardView.lbl.text = '(' + startPoint.x +',' + startPoint.y + ')';
....

La barre d’outils écoute également les clics

<?xml version="1.0" encoding="utf-8"?>
<mx:Tile xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
            import mx.charts.BubbleChart;
            import org.edorado.edoboard.view.components.shapes.*; 

            public static const TOOL_CHANGE:String  = "toolChange";
            public static const TEXT_TOOL:String  = "textTool";
            public static const SELECT_TOOL:String  = "selectTool";
            public static const RECTANGLE_TOOL:String  = "rectangleTool";

            private var b:Button = null;

            private function handleButtonClick(event:MouseEvent):void {
                trace("CLICKED  TOOL");
                // selectButton.dispatchEvent(new Event(TOOL_CHANGE, true, true)) 
                b = event.target as Button;
                b.dispatchEvent(new Event(TOOL_CHANGE, true, true));
            }


        ]]>
    </mx:Script>

          <!-- Use class facotry ? -->
          <mx:Button id="selectButton"
                     name="{SELECT_TOOL}"
                     selectedUpSkin="assets.skins.ToolButtonSkin"
                     width="30" 
                     height="30" 
                     styleName="selectButton" 
                     toolTip="selection" 
                     click="handleButtonClick(event); " />

          <mx:Button id="textButton"
                     name = "{TEXT_TOOL}"
                     selectedUpSkin="assets.skins.ToolButtonSkin"
                     width="30" 
                     height="30" 
                     styleName="textButton"  
                     toolTip="text"
                     click="handleButtonClick(event);" />

          <mx:Button id="rectButton" 
                     name = "{RECTANGLE_TOOL}"
                     selectedUpSkin="assets.skins.ToolButtonSkin"
                     width="30"
                     height="30"
                     styleName="rectButton"
                     toolTip="rectButton"
                     click="handleButtonClick(event);" />
</mx:Tile>

Answer 1

Merci, J'ai trouvé un message similaire en fait, je viens d'écouter souris dans ma barre d'outils et j'ai arrêté la propagation de l'événement de sorte que le canevas ne l'attrape pas.

Answer 2

Vous pouvez utiliser le target . propriété de votre MouseEvent pour différencier le comportement lorsque le click provient de votre barre d'outils. Prenez un butin sur LiveDocs pour comprendre quelle est la propriété cible.

Bonne chance!