FLEX3، النقر والتقاط الأحداث، حالة خاصة

Question

هنا مشكلتي:

I have a main canvas 'blackboard' in a panel, this canvas has itself several childs, like a toolbar (tiles), a label and some skinning.

المشكلة هي أنه عندما أنتقل إلى أداة المستطيل وأبدأ في رسم المستطيلات إذا كنت أرغب في تغيير الأداة عندما أقوم بالنقر فوق أداة أخرى مثل "دائرة" أو "تحديد"، فلن يلتقط الزر حدث النقر، بدلاً من ذلك سوف تمسك اللوحة القماشية بالماوس وتبدأ في الرسم.

تمامًا كما في الصورة. لذلك لا أستطيع تغيير الأداة بمجرد أن أبدأ الرسم.

نص بديل http://www.freeimagehosting.net/uploads/397a7cd49e.png

كيف لا يمكنني أن أجعل اللوحة القماشية تتفاعل عندما تكون على أداة، أو كيف يمكنني أن أجعل الزر يلتقط النقرة أولاً ويخبر اللوحة القماشية بعدم رسم أي شيء.

بالطبع يمكنني فقط وضع شريط الأدوات في مكان آخر ليس على اللوحة القماشية، ولكن بما أن المساحة مهمة، أود أن تكون الأزرار على اللوحة القماشية.

انا منفتح على أي اقتراحات.

=== فيما يلي بعض التعليمات البرمجية لإظهار كيفية عملها داخليًا.===

<?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>

شريط الأدوات عبارة عن قائمة من الأزرار الموجودة في المربع.ترتبط لوحة "السبورة" القماشية بالعديد من التعامل مع الأحداث، خاصة الماوس لأعلى ولأسفل والتحرك لرسم الأشكال.

...
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 + ')';
....

يستمع شريط الأدوات أيضًا إلى النقرات

<?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

Thanks, I found some similar post actualy i just listened for mouse down in my toolbar and stoped the event propagation so that the canvas dont catch it.

Answer 2

يمكنك استخدام هدف ملكية الخاص بك MouseEvent للتمييز بين التعليق عندما تكون النقرة من شريط الأدوات لديك.ما عليك سوى الاستفادة من LiveDocs لفهم الخاصية المستهدفة.

حظ سعيد!