2012-06-29 22 views
0

我將一個自定義組件顯示在鼠標懸停在用戶名後的下拉區域內。我正在使用兩種狀態,向上和懸停來切換我的下拉框。在鼠標上自定義下拉菜單

我的問題是,它認爲我在離開用戶名後離開組件級別Group。然後第二級組(我的下拉列表)消失。

我試過重新附加一個事件處理程序到我的組件級別GroupcallLater在我的鼠標功能,但沒有奏效。

<?xml version="1.0" encoding="utf-8"?> 
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" 
     mouseOver="groupLogIn_mouseOverHandler(event)" 
     mouseOut="groupLogIn_mouseOutHandler(event)" 
     > 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import spark.skins.SparkSkin; 
      protected function groupLogIn_mouseOverHandler(event:MouseEvent):void 
      { 

       this.currentState = "hover"; 
      } 

      protected function groupLogIn_mouseOutHandler(event:MouseEvent):void 
      { 

       this.currentState = "up" 
      } 
     ]]> 
    </fx:Script> 

    <s:states> 
     <s:State name="up"/> 
     <s:State name="hover"/> 
    </s:states> 

    <s:Label id="lblUsername" color="0xffffff" fontSize="14" right="18" top="5"/> 

    <s:Group includeIn="hover" width="160" height="110" top="20" right="0" > 
     <s:Rect top="0" right="0" bottom="0" left="0"> 
      <s:fill> 
       <s:SolidColor color="0x1a1a1a"/> 
      </s:fill> 
     </s:Rect> 
    </s:Group> 
</s:Group> 

回答

1

您需要爲您的鼠標事件設置一個「hitzone」。現在你的組件部分是完全透明的。當鼠標移過透明區域時,會觸發MOUSE_OUT事件。 (當我說'透明'時,μi實際上意味着什麼都沒有)。

幸運的是,這可以很容易地修復:只需添加覆蓋其他組件下方的整個區域的Rect,並將其alpha設置爲0即可。這使得Rect對用戶不可見,但它仍然可以對鼠標事件作出反應。

<s:Rect id="hitzone" top="0" right="0" bottom="0" left="0"> 
    <s:fill> 
     <s:SolidColor alpha="0" /> 
    </s:fill> 
</s:Rect> 

<s:Label id="lblUsername" /> 

...