Depois de ter visto o site do Adobe Air on Tour gostei muito da forma como eram mostradas as ToolTips.

Sendo assim, tentei verificar como se conseguia a "setinha" que aparece junto da ToolTips...

Depois de ter visto o site do Adobe Air on Tour gostei muito da forma como eram mostradas as ToolTips.

Sendo assim, tentei verificar como se conseguia a "setinha" que aparece junto da ToolTips...

Descobri então que há um parâmetro que passamos no método para criar um objecto deste tipo que faz com que possamos escolher se a "seta" aparece, e se sim, onde.

Claro que até pode não ser a melhor maneira de fazer este processo, uma vez que perdemos a noção de erro nas tooltips, e podemos criar o mesmo efeito através de styling através de CSS (confesso que não sei se é possível adicionar a seta...) mas esta deve ser, certamente, a forma mais rápida e mais fácil.

createToolTip(textoToolTip_str, coordX_num, coordY_num, estiloErro_str, contexto);

Segue o código explicado com um exemplo em que não utilizamos a errorTip e outros três em que modificados a propriedade do estilo do erro para que apareça em zonas diferentes:

Código:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="vertical">

    <mx:Script>
        <![CDATA[
            import mx.managers.ToolTipManager;
            import mx.controls.ToolTip;

            // Variáveis utilizadas no código
            private var myTip : ToolTip;
            private var et_txt : String;
            private var tipX : Number;
            private var tipY : Number;
            private var tt_txt : String;

            /**
             * createBigTip
             * @param e - Objecto com a referência ao que foi clicado
             */
            private function createBigTip( e : Object ) : void
            {

                // Referência ao nome do botão
                tt_txt = String( e.target.name );

                switch ( tt_txt )
                {

                    /**
                     * Atribuição dos parâmetros
                     * et_txt - String que nos diz se a "seta" aparece e onde;
                     * tt_txt - Texto que é passado para a caixa de texto;
                     * tipX - Coordenada da tooltip no eixo X;
                     * tipT - Coordenada da tooltip no eixo Y;
                     */

                    case "button1" :
                        et_txt = null;
                        tt_txt = "et_txt = null";
                        tipX = e.currentTarget.x + e.currentTarget.width + 10;
                        tipY = e.currentTarget.y;
                        break;
                    case "button2" :
                        et_txt = "errorTipRight";
                        tt_txt = "et_txt = errorTipRight";
                        tipX = e.currentTarget.x + e.currentTarget.width + 10;
                        tipY = e.currentTarget.y;
                        break;

                    case "button3" :
                        et_txt = "errorTipAbove";
                        tt_txt = "et_txt = errorTipAbove";
                        tipX = e.currentTarget.x;
                        tipY = e.currentTarget.y - e.currentTarget.height - 25;
                        break;
                    case "button4" :
                        et_txt = "errorTipBelow";
                        tt_txt = "et_txt = errorTipBelow";
                        tipX = e.currentTarget.x;
                        tipY = e.currentTarget.y + e.currentTarget.height + 10;
                        break;

                }

                // Criação da ToolTip com os valores referidos acima
                myTip = ToolTipManager.createToolTip( tt_txt, tipX, tipY, et_txt )as ToolTip;
            }

            /**
             * destroyBigTip
             * @param e - Objecto com referência ao que foi clicado
             */
            private function destroyBigTip( e : Object ) : void
            {
                ToolTipManager.destroyToolTip( myTip );
            }
        ]]>
    </mx:Script>

    <!-- Botões -->

    <mx:Button id="button1"
               label="Show right"
               rollOver="createBigTip(event)"
               rollOut="destroyBigTip(event)"/>
    <mx:Button id="button2"
               label="Show right"
               rollOver="createBigTip(event)"
               rollOut="destroyBigTip(event)"/>
    <mx:Button id="button3"
               label="Show above"
               rollOver="createBigTip(event)"
               rollOut="destroyBigTip(event)"/>
    <mx:Button id="button4"
               label="Show bellow"
               rollOver="createBigTip(event)"
               rollOut="destroyBigTip(event)"/>

</mx:Application>

Se quiserem ver o exemplo "live": Exemplo

Se quiserem descarregar o projecto: ToolTips.zip

Se quiserem saber mais sobre ToolTips..

Flex Help Resource Center

Adobe Developer Connection

Abraço e até daqui a uns dias!