[Flashcoders] Tool Tip with Flash MX 2004 DataGrid

[Leif Wells]

I posted this on my blog (http://www.leifwells.com), but I thought I'd
try giving the Flashcoders list a shot at this, too.

We are trying to get a tool tip to work with a DataGrid component. And failing.

The project we are doing is a rather complex AS 2.0 project, so I
created this rather simple AS 1.0 version as a stand-alone example of
our problem. (you'll note that the "setInterval()" and
"clearInterval()" calls are commented to prove that they are not the
problem)

The FLA file with the code (below) can be downloaded at:
http://www.leifwells.com/zip/dg_problem.zip

THE PROBLEM: when you roll over the text in the cell a "itemRollOut"
event is getting fired a "itemRollOver" is also fired -- that's when
the cursor changes to the i-beam cursor.

For instance, if you test the FLA file and you move your cursor over
the area to the right of the "price" column, you'll see the tool tip
pop up just fine. But then try moving your cursor over the price or
the name. Keep moving it across the text. What a mess!

If anyone has experience with this issue or has issues with the way
that we are trying to accomplish this, feel free to shout.

//code
dataGrid_dg.setSize(300, 100);
dataGrid_dg.move(5, 5);

trace_ta.setSize(300, 200);
trace_ta.move(5, 110);

clear_pb.move(5, 320);

var clickListener:Object = new Object();
clickListener.click = function()
{
        trace_ta.text = "";
}
clear_pb.addEventListener("click", clickListener);

var dgNameColumn:mx.controls.gridclasses.DataGridColumn= new
mx.controls.gridclasses.DataGridColumn("name");
dataGrid_dg.addColumn(dgNameColumn);
                                
var dgPriceColumn:mx.controls.gridclasses.DataGridColumn = new
mx.controls.gridclasses.DataGridColumn("price");
dataGrid_dg.addColumn(dgPriceColumn);

dataGrid_dg.getColumnAt(0).width = 200;
dataGrid_dg.getColumnAt(1).width = 100;

dp = new Array();
for(var i:Number = 0; i< 25; i++){
        //_root.dp.push({name: "MMMMMM", price: "$9.99"})
        dp.addItem({name: i + " M M M M M M M M M M M M M M M M M M M",
price: "$9.99"});
}

dataGrid_dg.dataProvider = dp;

var rowRollOver = new Object();
rowRollOver.itemRollOver = function(event_obj:Object)
{
        //clearInterval(_root.toolTipInterval);
        var name:String = event_obj.target.getItemAt(event_obj.index).name;
        traceText("itemRollOver: name: " + name);
        if(name != undefined){
                trace("rollOver");
                
                var xvar:Number = event_obj.target._x + 10;
                var yvar:Number = event_obj.target._y + ((event_obj.index + 1) 
* 20);
                
                var tt_fmt:TextFormat = new TextFormat();
                tt_fmt.font = "Arial"
                
                if(!_root.toolTip_tf){
                        _root.createTextField("toolTip_tf", 10000, xvar, yvar, 
20, 20);
                        toolTip_tf = _root.toolTip_tf;
                        
                        toolTip_tf.border = true;
                        toolTip_tf.background = true;
                        toolTip_tf.backgroundColor = 0xF9FCEC;
                        toolTip_tf.autoSize = true;

                }else{
                        toolTip_tf._x = xvar;
                        toolTip_tf._y = yvar;                           
                }
                toolTip_tf.text = name;
                //toolTip_tf.embedFonts = true;
                
                toolTip_tf.setTextFormat(tt_fmt);
                
                toolTip_tf._visible = false;
                
                showToolTip(_root.toolTip_tf);
                //_root.toolTipInterval = setInterval(showToolTip, 2000, 
_root.toolTip_tf);
        }
}

dataGrid_dg.addEventListener("itemRollOver", rowRollOver);

rowRollOut = new Object();
rowRollOut.itemRollOut = function(event_obj:Object)
{
        var name:String = event_obj.target.getItemAt(event_obj.index).name;
        if(name != undefined){
                traceText("rollOUT: " +
event_obj.target.getItemAt(event_obj.index).getName());
                removeToolTip();
        }else{
                //clearInterval(_root.toolTipInterval);
        }
}

dataGrid_dg.addEventListener("itemRollOut", rowRollOut);                


function showToolTip(tt)
{
        traceText("showing ToolTip");
        tt._visible = true
        //clearInterval(_root.toolTipInterval);
}
        
function removeToolTip()
{
        traceText("removing ToolTip");
        toolTip_tf._y = -100;
        toolTip_tf.text = "";
        toolTip_tf._visible = false;
        //destroyObject("toolTip_tf");
}

function traceText(str:String)
{
        trace_ta.text += "\r" + str;
        trace_ta.vPosition = trace_ta.maxVPosition;
        trace(str);
}

stop();
_______________________________________________
Flashcoders mailing list
Flashcoders@chattyfig.figleaf.com
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders