Until now I haven’t had much reason to alter the default tool tip behavior in Flex: apart from styling, the tool tips work just fine out of the box for most applications. Recently, though, I’ve started playing with the tool tips a little, and thought I’d share some of the results.

First, it’s very easy to add show and hide effects to the tool tips. The only quirk is a standard Flash / Flex thing: to animate the alpha of text, the font needs to be embedded. Apart from that, it’s a simple matter of defining the effects that you want and then setting the value of the ToolTipManager.showEffect and ToolTipManager.hideEffect properties to your new effects. Cool!

However, there are a couple of things about the way the tool tip effects work that I find mildly disappointing. One of these is that the hideEffect is not triggered on mouse-out. Instead, when you roll the mouse cursor off of the UI element, the tool tip goes away instantly, just as though you never set a value for hideEffect. The only time the hideEffect is triggered is if the mouse cursor remains on the UI element past the time set in the ToolTipManager.hideDelay property (the default is 10 seconds).

The other disappointing thing (and maybe I’m just contrary) is that the showEffect *does* get triggered even when there is no delay between tool tips. What I mean here is that ToolTipManager has a property called scrubDelay (default = 100 milliseconds) that defines how much time there needs to be between mouse-out and mouse-over in order for showDelay (default = 500 milliseconds) to kick in. So if you have two buttons right next to each other (each with its toolTip property set to something interesting) and the user moves quickly from one to the next, Flex will dispense with the delay and show the tool tips immediately. Under these circumstances, it would seem to me to be ideal if Flex also dispensed with the showEffect, because by the very nature of effects (change over time) the showEffect necessarily introduces a delay.

OK - if a picture is worth a thousand words, then a code sample is worth a million. Check out this sample app which has no effect defined. When you move the mouse cursor quickly from one button to the next, you’ll notice that there is a delay of about 0.5 second for the first tool tip to appear, but after that there is no delay. Click here to view the application, and right-click on the app to view the source (not very interesting source, you’ll no doubt agree).

Now, here is an app with effects defined and assigned to the tool tip. When you move the mouse cursor from one button to the next, you’ll see that the hideEffect is omitted but the showEffect isn’t. Click here to view, and right-click on the app to view the source (somewhat more interesting source this time - I recommend you download and play with it).