在DataGrid上显示toolTip

 

http://hereson.javaeye.com/blog/210674

<?xml version="1.0" encoding="utf-8"?>

<mx:Applicationxmlns:mx=" http://www.adobe.com/2006/mxml ">

   <mx:Script>

      <![CDATA[

          private function showTip(obj:XML):String

          {

             return obj.phone;

          }

      ]]>

   </mx:Script>

   <mx:XMLList id=" employees " >

       <employee>

           <name> Christina Coenraets </name>

           <phone> 555-219-2270 </phone>

           <email> [e-mail] </email>

           <active> true </active>

       </employee>

       <employee>

           <name> Joanne Wall </name>

           <phone> 555-219-2012 </phone>

           <email> [e-mail] </email>

           <active> true </active>

       </employee>

       <employee>

           <name> Maurice Smith </name>

           <phone> 555-219-2012 </phone>

           <email> [e-mail] </email>

           <active> false </active>

       </employee>

       <employee>

           <name> Mary Jones </name>

           <phone> 555-219-2000 </phone>

           <email> [e-mail] </email>

           <active> true </active>

       </employee>

   </mx:XMLList>

   <mx:Panel title=" DataGrid Control Example" height=" 100% " width=" 100% "

       paddingTop=" 10 " paddingLeft=" 10 " paddingRight=" 10 " >

      <!-- 三种方法在DataGrid 上显示 toolTip ，此 DataGrid上共显示了三列，前两列需要将 showDataTips属性设为 true ！！

         第一列采用设置列属性 dataTipField 的方式来显示 toolTip ，本示例中可以设为： name ， phone， email 或active ；

          第二列采用设定 Tip函数 dataTipFunction的方式来显示，此函数默认会获取本列绑定的数据作为参数，所以不需指定；

          第三列采用 itemRenderer的方式，给其中的控件指定 toolTip来达到目的，此处用的是 Text ，用 label 会更好一些，

          在内容显示不全的时候， label 会自动显示 toolTip，无需指定。 -->

       <mx:DataGrid id=" dg " width=" 100% " height=" 100% " rowCount=" 5 " dataProvider=" { employees } " >

           <mx:columns>

               <mx:DataGridColumn dataField=" name " headerText=" Name " showDataTips=" true " dataTipField=" name " />

               <mx:DataGridColumn dataField=" phone " headerText=" Phone " showDataTips=" true " dataTipFunction=" showTip" />

               <mx:DataGridColumn headerText=" Email " >

               <mx:itemRenderer>

                     <mx:Component>

                        <mx:Texttext=" { data.email } " toolTip=" { data.email } " />

                     </mx:Component>

               </mx:itemRenderer>

               </mx:DataGridColumn>

           </mx:columns>

       </mx:DataGrid>

       

   </mx:Panel>

</mx:Application>