在ComboBox项目RollOver中将当前项显示为工具提示

时间:2009-11-24 09:00:56

标签: flex actionscript-3

我需要知道如何在ComboBox itemRollOver事件中显示当前项目作为工具提示我目前正在使用以下代码,

private var tip:ToolTip
private function ItemRollOver(event:ListEvent):void
{           
    var currComboBox:ComboBox = event.currentTarget as ComboBox;
    var tipInfo:String = currComboBox.dataProvider[event.rowIndex].label;
    tip = ToolTipManager.createToolTip(tipInfo,this.mouseX,this.mouseY) as ToolTip;
}

private function ItemRollOut(event:Event):void
{           
    ToolTipManager.destroyToolTip(tip);             
}


<mx:ComboBox id="cbLblStyle" fontFamily="Arial" dataProvider="{styleCollection}" 
    selectedItem="{labels.styleName}"  itemRollOver="ItemRollOver(event)"  
    itemRollOut="ItemRollOut(event)" click="ItemRollOut1(event)" 
    close="cbLblStyle_changeEvt(event)" fontSize="12" x="12" y="240" 
    width="188"/>

但这有一些问题,当我点击项目或itemRollOver时,更快的工具提示不会被破坏一段时间。

还有其他办法吗?

提前致谢

3 个答案:

答案 0 :(得分:2)

使用自定义itemRenderer

<mx:ComboBox>
    <mx:dataProvider>
        <mx:Array>
            <mx:String>ASD</mx:String>
            <mx:String>QWE</mx:String>
            <mx:String>ZXC</mx:String>
            <mx:String>123</mx:String>
        </mx:Array>
    </mx:dataProvider>
    <mx:itemRenderer>
        <mx:Component>
            <mx:TextInput text="{data}" toolTip="{data}"/>
        </mx:Component>
    </mx:itemRenderer>
</mx:ComboBox>

项目渲染器:

<!-- write this in CustomRenderer.mxml -->
<mx:VBox backgroundColor="#ffff00">
  <mx:Label text="This is my custom renderer"/>
  <mx:TextInput text="{data}" toolTip="{data}"/>
</mx:VBox>

<!---
/**
* now you can use `CustomRenderer` as item renderer in any class 
* using the following syntax:
* */
//your main application class
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
  backgroundColor="#ff0000">
  <mx:ComboBox id="cb1" itemRenderer="CustomRenderer" dataProvider="{dp1}"/>
  <mx:ComboBox id="cb2" itemRenderer="CustomRenderer" dataProvider="{dp2}"/>
  <mx:ComboBox id="cb3" itemRenderer="CustomRenderer" dataProvider="{dp3}"/>
  <mx:Script>
    <![CDATA[
      private var dp1:ArrayCollection = new ArrayCollection(["asd", "fgh", "lkj"]);
      private var dp2:ArrayCollection = new ArrayCollection(["qwe", "rty", "poi"]);
      private var dp3:ArrayCollection = new ArrayCollection(["123", "456", "789"]);
    ]]>
  </mx:Script>
</mx:Application>

答案 1 :(得分:0)

实际上答案1将完美地工作但是只有在鼠标指针下面有组合框项目的TEXT时才会出现工具提示。表示如果鼠标指针悬停在组合框的项目上,但如果该项目的文本不在鼠标指针下,则工具提示将不会显示。

所以我们必须在itemRollOver,itemRollOut,focusOut等上定义一些函数来显示/删除自定义工具提示(比如vbox等使用工具提示作为弹出窗口)。

答案 2 :(得分:0)

仅在具有截断字符串的行中在下拉菜单中显示工具提示的最简单方法:

<mx:ComboBox>
    <mx:itemRenderer>
        <mx:Component>
            <mx:Label truncateToFit="true"/>
        </mx:Component>
    </mx:itemRenderer>
</mx:ComboBox>