使用ToolTipManager自定义tooltip
直接贴代码,一看就懂。
<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" width="400" height="150" horizontalAlign="center" verticalAlign="middle"><mx:Style>global{font-size: 12;theme-color: haloSilver;}Application{background-color: #dddddd;}.errorTip{font-size: 12;}.testTip{font-size: 12;border-color: #ffffdd;color: #ff0000;font-weight: bold;}</mx:Style><mx:Script><![CDATA[import mx.managers.ToolTipManager;import mx.controls.ToolTip; private var _tip:ToolTip; private function _showTip($txt:String):void{trace(_tip);if(_tip == null){var __point:Point = new Point(emailTI.x, emailTI.y);trace(__point)__point = emailTI.localToGlobal(__point);trace(__point); _tip = ToolTipManager.createToolTip($txt, __point.x - emailTI.x, __point.y - 40 , 'errorTipAbove') as ToolTip; _tip.styleName = 'testTip';}} private function _destoryTip():void{if(_tip){ToolTipManager.destroyToolTip(_tip);}_tip = null;}]]></mx:Script><mx:EmailValidator id="emailV" source="{emailTI}" property="text" trigger="{btn}" triggerEvent="click"/><mx:Form horizontalCenter="0"><mx:FormItem label="电子邮件:" width="100%"><mx:TextInput id='emailTI' width="100%"/></mx:FormItem><mx:FormItem horizontalAlign="center" width="100%" direction="horizontal"><mx:Button id="btn" label="提交"/><mx:Button id='btn2' label="显示Tip" click="_showTip('测试弹出Tip')"/><mx:Button id='btn3' label="取消Tip" click="_destoryTip()"/></mx:FormItem></mx:Form></mx:Application> ?
范例效果:
?
tips:
1.createToolTip生成的ToolTip,必须用destoryToolTip来清除。如果在清楚之前再次调用createToolTip,则会生成重复的ToolTip。ToolTipManager有一个currentToolTip属性来保存当前显示的ToolTip,但这个属性对于使用createToolTip创建的ToolTip并没有效果
2.
createToolTip的第4个参数是指定箭头。如果为空,就不显示箭头。如果为下面三个字符串值中的一个,则会显示箭头:
errorTipAboveerrorTipRighterrotTipBelow摘自:http://zengrong.net/post/455.htm