Share on Google+Share on Google+

Flex Simple ToolTip

In this flex tutorial we can illustrate how to create a Tooltip and what is the use of toolTip in Adobe Flex. And also create mxml and action script with example.

Flex ToolTip:-

The Flex ToolTip are a mechanism (method) to give the useful information to the user. Flex ToolTip are display information when a user moves the mouse pointer on the graphical component. A user point the graphical component , ToolTip are appear and after click that particular component, ToolTip are disappear. It contains only textual information for the user. Flex 4 ToolTip have no limit for the textual information. Some Flex Component  have its own ToolTip.

you can see how to create ToolTip in Flex with the help of this example.

<?xml version="1.0"?>

<mx:Application xmlns:mx="">

<mx:Panel width="250" height="250" horizontalAlign="center" verticalGap="25">

<mx:Image id="img" source="@Embed(source='assets/button1.jpeg')" toolTip="Image Tool Tip"/>

<mx:Button id="button1" label="My Button for tooltip." toolTip="Button Tool Tip"/>

<mx:LinkButton id="linkbutton1" label="My Link Button for tooltip." toolTip="Link Button Tool Tip"/>



In this example you can see how to create tooltip for Image, Button, and LinkButton.

Running this code in your flex environment after that output are display like that:

This ToolTip for Image.

This ToolTip for Button.

This ToolTip for Link button.

This is the way to create simple ToolTip  for the graphical component in flex. After that we can discuss about how to create ToolTip fort the graphical component with the help of action script. you can see this process in below example. In this example you can see tooltip for Image, Button, and Link Button. Example are given below:

<?xml version="1.0"?>

<mx:Application xmlns:mx="" creationComplete="init();">


private var imageLarge:String = "assets/button.jpeg";

public function init():void{


img.toolTip= "Image Tool Tip";

button1.toolTip="Button ToolTip";

linkbutton1.toolTip="Link Button ToolTip";



<mx:Panel width="250" height="250" horizontalAlign="center" verticalGap="25" title="Tooltip through actionscript">

<mx:Image id="img"/>

<mx:Button id="button1" label="My Button"/>

<mx:LinkButton id="linkbutton1" label="My Link Button"/>



In this process we can create ToolTip for graphical component in flex through action script. we have set tooltip in the action script function using component ID. Running this example and see the output like this:

This ToolTip for Image created with the help of action script.

This ToolTip for Button created with the help of action script.


Posted on: March 15, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.


Advertisement null