0

我在表格中有一个下拉列表(作为自定义渲染器)。由于屏幕上存在一些空间限制,某些选项太长而无法在表格或下拉列表中显示。然而,我们确实有一个显示全文的工具提示。

问题是这是表中的最后一列,并且用户的 PC 也有一些分辨率限制。现在工具提示显示,其中一部分在用户监视器上被切断。

现在我可以去调整工具提示的 X 位置(-150)。

private function createToolTip(event:ListEvent):void {          
    tip = ToolTipManager.createToolTip("THE TEXT", this.parentApplication.mouseX - 150, this.parentApplication.mouseY) as ToolTip;                  
}

现在这可以按预期工作,但如果文本很短,它会在中间显示。

所以我在工具提示中添加了一个宽度(200)

private function createToolTip(event:ListEvent):void {          
     tip = ToolTipManager.createToolTip("THE TEXT", this.parentApplication.mouseX - 150, this.parentApplication.mouseY) as ToolTip;
     tip.width = 200;                   
}

现在这显示正常,文本至少显示在下拉列表旁边。

但问题是,只要将超过 200 的文本存储在数据库中,它就不会显示全文。

有谁知道如何让工具提示右对齐而不是左对齐。这样,无论文本有多长,它都会显示在左侧。

4

1 回答 1

2

这是一个解决方案,它实现了右对齐的单行和多行工具提示。

在此处输入图像描述

为此,您应该执行两个步骤:创建您自己的 Tooltip 类并让 TooltipManager 使用它。

//工具提示.as

package com.tooltip
{
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;
import flash.text.TextFormatAlign;
import mx.controls.ToolTip;

public class MyToolTip extends ToolTip
{
    public var align:String = "left"; //left or right

    public function MyToolTip()
    {
        super();
    }

    override protected function commitProperties():void
    {
        super.commitProperties();
    }

    override protected function measure():void
    {
        super.measure();

        var tf:TextFormat = textField.getTextFormat();

        if (align == "right")
            tf.align = TextFormatAlign.RIGHT
        else
            tf.align = TextFormatAlign.LEFT;

        textField.setTextFormat(tf);
    }

    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
        super.updateDisplayList(unscaledWidth, unscaledHeight);

        textField.autoSize = TextFieldAutoSize.NONE;
        textField.width = this.width - 2*textField.x;
    }
}
}

第二步并不简单。

TooltipManager 有一个属性“toolTipClass”,它说明应该使用哪个类来创建 Tooltip。

ToolTipManager.toolTipClass = MyToolTip;

SDK 中存在错误,导致无法正确实施。网络上经常讨论这个问题。

创建新工具提示时,不考虑“工具提示类”。相应的代码行如下所示:

var toolTip:ToolTip = new ToolTip();

但应该是这样的:

var toolTip:IToolTip = new ToolTipManager.toolTipClass();

纠正此行为的唯一方法是对 ToolTipManagerImpl 类进行猴子修补。这里描述得很好。

现在您可以在应用程序中使用工具提示:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
xmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute" 
minWidth="955" minHeight="600" >
<mx:Script>
    <![CDATA[
        import com.tooltip.MyToolTip;
        import mx.controls.ToolTip;
        import mx.managers.ToolTipManager;

        private const TOOLTIP_WIDTH:int = 200;

        protected function onBtnClick(event:MouseEvent):void
        {
            ToolTipManager.toolTipClass = MyToolTip;
            ToolTip.maxWidth = TOOLTIP_WIDTH;

            var tip:MyToolTip;

            tip = ToolTipManager.createToolTip("Your text", this.mouseX - 150, this.mouseY) as MyToolTip;

            tip.align = "right";
            tip.width = TOOLTIP_WIDTH;  
        }

    ]]>
</mx:Script>

<mx:Button id="myBtn" x="194" y="145" label="Show Tooltip" click="onBtnClick(event)"/>
</mx:Application>

同时使用“width”和“maxWidth”属性非常重要。要将对齐方式更改为“左”,请使用

tip.align = "left";

此代码中的行顺序也很重要。

我希望它会帮助你!

//编辑

在这里您可以找到 ToolTipManagerImpl 的修补版本。将其放入项目的根目录中。包名和SDK中的一样,所以系统会取这个。

于 2013-02-04T10:25:52.393 回答