Cómo mostrar tooltips dentro de componentes List de Flex

Por: Zguillez

13 de Julio del 2008

7273 de clabLevel
Otros artículos de Zguillez

5,322 visitas

flex

Este es un tip muy sencillito que consiste en cómo añadir tooltips a cada uno de los elementos de un componente List en Flex.

Primero de todo supongamos que tenemos un compomente list en nuestra aplicación que nos muestra un listado. En este caso tenemos un listado de usuarios de Clab dentro de un Array registrando el nombre y el clablevel.

Código :

<mx:List id="listado"
   horizontalCenter="0" verticalCenter="0" 
   width="200" height="200">
   
   <mx:dataProvider>
   <mx:Array>
         <mx:Object label="Freddie" level="43458"/>
         <mx:Object label="Elecash" level="7289"/>
         <mx:Object label="_Conejo" level="7203"/>
         <mx:Object label="XKlibur" level="4713"/>
         <mx:Object label="Zguillez" level="4120"/>
         <mx:Object label="Eldervaz" level="3123"/>
         <mx:Object label="Mariux" level="2921"/>
         <mx:Object label="Zah" level="2906"/>
         <mx:Object label="Bleend" level="2016"/>
         <mx:Object label="Carmen Vivas" level="610"/>
      </mx:Array>
   </mx:dataProvider>   
</mx:List>

Código :

<mx:List id="listado"
   horizontalCenter="0" 
   verticalCenter="0" 
   width="200" height="200"
   showDataTips="true"
   dataTipFunction="showTip">

Código :

<mx:Script>
   <![CDATA[            
      public function showTip(i:Object):String
      {
         return i.level;
      }
   ]]>
</mx:Script>

Código :

<mx:itemRenderer>
   <mx:Component>
      <mx:Label text="{data.label}" toolTip="{data.level}"/>
   </mx:Component>
</mx:itemRenderer>

Código :

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
   
   <mx:Script>
      <![CDATA[         
         public function showTip(i:Object):String
         {
            return i.level;
         }
      ]]>
   </mx:Script>

   <mx:List id="listado"
      horizontalCenter="0" 
      verticalCenter="0" 
      width="200" height="200"
      showDataTips="true"
      dataTipFunction="showTip">
      
      <mx:dataProvider>
         <mx:Array>
            <mx:Object label="Freddie" level="43458"/>
            <mx:Object label="Elecash" level="7289"/>
            <mx:Object label="_Conejo" level="7203"/>
            <mx:Object label="XKlibur" level="4713"/>
            <mx:Object label="Zguillez" level="4120"/>
            <mx:Object label="Eldervaz" level="3123"/>
            <mx:Object label="Mariux" level="2921"/>
            <mx:Object label="Zah" level="2906"/>
            <mx:Object label="Bleend" level="2016"/>
            <mx:Object label="Carmen Vivas" level="610"/>
         </mx:Array>
      </mx:dataProvider>      
   </mx:List>  
</mx:Application>

Código :

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

   <mx:List id="listado"
      horizontalCenter="0" 
      verticalCenter="0" 
      width="200" height="200">
      
      <mx:itemRenderer>
         <mx:Component>
            <mx:Label text="{data.label}" toolTip="{data.level}"/>
         </mx:Component>
      </mx:itemRenderer>

      <mx:dataProvider>
         <mx:Array>
            <mx:Object label="Freddie" level="43458"/>
            <mx:Object label="Elecash" level="7289"/>
            <mx:Object label="_Conejo" level="7203"/>
            <mx:Object label="XKlibur" level="4713"/>
            <mx:Object label="Zguillez" level="4120"/>
            <mx:Object label="Eldervaz" level="3123"/>
            <mx:Object label="Mariux" level="2921"/>
            <mx:Object label="Zah" level="2906"/>
            <mx:Object label="Bleend" level="2016"/>
            <mx:Object label="Carmen Vivas" level="610"/>
         </mx:Array>
      </mx:dataProvider>      
   </mx:List>  
</mx:Application>

También te interesa

• Enviar y recibir datos UDP con Adobe AIR 2.0
• Acceder a dispositivos de almacenamiento en AIR 2.0
• Control de errores globales en Adobe AIR 2.0

flex

<mx:Object label="esutoraiki" level="190"/>

excelente tip Z
Por: eldervaz

Buen dato
Por: Otaku RzO

Señor Zguillez, usted y su tip serán enseñados en mi clase esta noche.
Por: Freddie