1

Is there a way to show a tool tip over a cell when the text is truncated in an mx DataGrid? If not in mx DataGrid I'm interested in Spark but I will have to convert so that's a last resort.

Update
There is a way show a tip conditionally. If you create a dataTipFunction and then if you return null it won't show a tool tip. So, theoretically I could get the length of the text, and see if it is over a certain amount and if it is then return the text and if it isn't This would not be accurate because if the text contains 5 "i" characters it would be much shorter than 5 "m" characters as you can see in the text below:

iiiii
mmmmm

zero323
  • 322,348
  • 103
  • 959
  • 935
1.21 gigawatts
  • 16,517
  • 32
  • 123
  • 231
  • Some postings about text width here: http://stackoverflow.com/questions/2916919/calculating-text-width-in-actionscript-and-flex – ethrbunny Mar 15 '13 at 16:08
  • @ethrbunny - Thanks! That might work. For that to work I would have to get a reference to the label in the cell renderer. – 1.21 gigawatts Mar 15 '13 at 16:21
  • 1
    But now that I think about it, if I can get a reference to the label in the cell renderer I could just compare the label width to the column width! :P – 1.21 gigawatts Mar 15 '13 at 16:23

1 Answers1

4

If you are interested in a spark solution, here is my example. Use a magic property of spark Label "showTruncationTip".

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600">
<fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;

        [Bindable]private var collection:ArrayCollection = new ArrayCollection([
            {field01:"field01", content:"your content", field02:"field02"},
            {field01:"field01", content:"your content your content your content your content", field02:"field02"},
            {field01:"field01", content:"your content your content your content your content", field02:"field02"}
        ]);
    ]]>
</fx:Script>

<s:DataGrid
    x="10" y="10"
    width="320" height="120" 
    dataProvider="{collection}">

    <s:columns>
        <s:ArrayList>   
            <s:GridColumn dataField="field01" headerText="Field 1"/>
            <s:GridColumn dataField="content" headerText="Content" width="120">
                <s:itemRenderer>
                    <fx:Component>
                        <s:GridItemRenderer>
                            <s:HGroup width="100%" height="100%" verticalAlign="middle" paddingLeft="8">
                                <s:Label text="{data.content}" width="100%" maxDisplayedLines="1" showTruncationTip="true"/>
                            </s:HGroup>
                        </s:GridItemRenderer>
                    </fx:Component>
                </s:itemRenderer>
            </s:GridColumn>
            <s:GridColumn dataField="field02" headerText="Field 2" width="100"/>
        </s:ArrayList>                  
    </s:columns>                
</s:DataGrid>
</s:Application>
Anton
  • 4,544
  • 2
  • 25
  • 31