Question

我试图通过使文本htmlText与此类似，在Flex 4中的工具提示中插入图像和其他html内容：

http://blogagic.com/190/easy-flex-tooltip-customization-using-html-tags

我的HTMLToolTip类：

package custom
{
    import mx.controls.ToolTip;

  public class HTMLToolTip extends ToolTip
  {
    public function HTMLToolTip()
    {
        super();
    }

    override protected function commitProperties():void{
        super.commitProperties();
        textField.htmlText = text;
    }
  }
}

在Tooltip Creation上，我将类设置为ToolTipManager类

protected function helpToolTip_toolTipCreateHandler(event:ToolTipEvent):void
{   
        ToolTipManager.toolTipClass = HTMLToolTip;
        helpToolTip.tooltip = "<img src='ui_graphic/testimage.png' width='20' height='20'/> this is a <b>tool</b> tip";
}

但它在Flex 4中似乎不再起作用（从在线的各种评论来看也是如此）。图像没有显示出来。我尝试过的每个其他基本HTML标记都可以正常工作。有没有人让这个在Flex 4上工作，还是应该研究另一个（更复杂的）解决方案？

Answer 1

创建工具提示类扩展了RichText：

package classes
{
    import mx.core.IToolTip;

    import spark.components.RichText;
    import spark.utils.TextFlowUtil;

    public class RichToolTip extends RichText implements IToolTip
    {
        public function RichToolTip()
        {
            super();

            mouseEnabled = false;
            mouseChildren = false;
            setStyle("backgroundColor", "0xeeeeee");
        }

        override public function set text(value:String):void 
        {
            textFlow = TextFlowUtil.importFromString(value);
        } 
    }
}

在应用程序集中新的工具提示类：

ToolTipManager.toolTipClass = RichToolTip;

并在按钮上添加工具提示：

btn.toolTip = "<div><img source='assets/bender_saved.png' width='20' height='20' /><p>this is a test <span fontWeight='bold'>bold</span></p></div>";

在Flex 4中的工具提示中添加图像

1 个答案: