Flex Tooltip – Texte HTML (et images) dans un tooltip Flex
Les tooltips Flex peuvent être ajoutés sur tous les composants visuels Flex. Au survol, une info-bulle apparait avec le texte spécifié. Cela peut permettre de sauver de la place en y mettant un texte explicatif que l'utilisateur ne voit que lorsqu'il se déplace sur une zone / un composant.
Flex ToolTip – Ajouter des ToolTips à vos composants
Pour les harmoniser avec votre application, vous pouvez leur appliquer un style. Mais ces propriétés de style ne vont pas bien loin.
Heureusement, on peut aller encore plus loin en intégrant du texte HTML. Vous pourrez ainsi afficher des informations en gras ou en couleur. Vous pouvez en fait intégrer toutes les balises gérées par la propriété htmlText de la classe Text. Y compris le tag <img> qui va vous permettre d'afficher des images dans les info-bulles:
Voir l'article original: Easy Flex ToolTip customization using HTML tags
Flex ToolTip – Créer des ToolTips avec la méthode createToolTip()
Vous savez surement ajouter des toolTip à vos composants Flex. Rien de plus simple, il suffit de spécifier la propriété toolTip. Mais peut-être que dans certains cas, vous voudrez créer ces toolTip à la main grâce à du code ActionScript 3.
Le ToolTipManager à deux méthodes qui vous permettent d'utiliser les toolTips de manière programmatique. Ces méthodes sont createToolTip() et destroyToolTip(), que vous pouvez utiliser pour créer ou détruire les objets ToolTip. Quand vous créez un objet toolTip, vous pouvez le personnaliser comme vous le feriez pour n'importer quel objet, en accédant à ses propriétés, styles, events et effets.
La méthode createToolTip() retourne un objet de type IToolTip, que Flex va afficher jusqu'à ce que vous le détruisiez. Cette méthode à la signature suivante:
createToolTip(text:String, x:Number, y:Number, errorTipBorderStyle:String, context:IUIComponent):IToolTip
Le paramètre text définit le contenu du toolTip. Les paramètres x et y définissent les coordonnées x et y, relative à l'application. La propriété errorTipBorderStyle donne la position du pointeur du toolTip d'erreur. Ce paramètre est optionnel.
Flex ToolTip – Gérer la largeur des ToolTip et les retours à la ligne
Par défaut, les toolTips ont une largeur maximale de 300 pixels, et le texte va automatiquement s'adapter à cette largeur. Vous pouvez voir le comportement par défaut dans l'exemple suivant:
<mx:Button id="button" label="ToolTip!" toolTip="Ceci est un toolTip très très long, mais alors très très long, aussi long que si j'avais fait des copier coller. Il va même tenir sur 3 lignes"/>
Flex Source Code Download: Télécharger le code source complet de l'application
Cet exemple crée un bouton avec un très long toolTip qui dépasse la largeur maximale, des retours à la ligne sont donc automatiquement insérés.
Flex ToolTip – Ajouter des ToolTips à vos composants
Quand une application contient des éléments graphiques (icônes, images...), il peut être utile de donner une description textuelle de ces éléments. C'est encore plus pratique quand l'élément graphique n'a pas un sens évident. Plutôt que de charger l'écran avec des descriptions textuelles fixes, vos applications Flex peuvent comporter des ToolTips. Ce sont des blocs de texte qui apparaissent quand l'utilisateur bouge la souris au dessus d'un élément graphique.
Ajouter des ToolTips avec Flex
Tous les composants qui héritent de UIComponent (ce qui inclut tous les composants visuels et les conteneurs) implémentent une propriété toolTip (getter/setter) qui va vous permettre d'assigner une String à l'objet sur lequel vous voulez afficher un tooltip. Vous pouvez fixer cette propriété simplement en utilisant du MXML comme dans cet exemple:
<mx:Button id="button" label="Exemple" toolTip="Exemple de ToolTip"/>
Flex Source Code Download: Télécharger le code source complet de l'application
Mes projets (Open Source)
Autres
