`

Flex/AIR个性化——ToolTip

阅读更多

编写自己的应用时,自定义ToolTip应该是满常用到的。

定制ToolTip还是比较简单的,关键步骤如下:

 

1. 任何自定义组件均可用作ToolTip,只要实现mx.core.IToolTip接口即可(MXML编写的组件则在 root 标签中加上 implements="mx.core.IToolTip" 即可);

 

2. 需要显示 toolTip 的组件相关代码要点:

1) toolTip=" "   注:必须要留个空串,不然 toolTip 不显示。

 

2) toolTipCreate="toolTipCreateHandler(event)" ,在该事件处理函数中创建自定义的ToolTip实例;

   

    事件处理函数举例如下:

protected function toolTipCreateHandler(event:ToolTipEvent):void
{
    var customToolTip:CustomToolTip = new CustomToolTip();
    event.toolTip = customToolTip;
}

 

3) 如果还需要控制 toolTip 的显示位置,可通过 toolTipShown="toolTipShownHandler(event)" 来实现;

   

    事件处理函数举例如下:

protected function toolTipShownHandler(event:ToolTipEvent):void
{
    var customToolTip:CustomToolTip = event.toolTip as CustomToolTip;
    
    // set customToolTip position: 
    // 显示在某个 label  的正下方,toolTip 与该label 左对齐,且正好在该lable正下方
   var globalPos:Point = aLabelId.localToGlobal(new Point(aLabelId.x, aLabelId.y));
     customToolTip.x = globalPos.x - 12.5;
     customToolTip.y = globalPos.y + aLabelId.height;
}

 

更多关于 ToolTip 的,可参阅:

http://help.adobe.com/zh_CN/flex/using/WS2db454920e96a9e51e63e3d11c0bf60d65-7ff6.html

http://flex-java-oracle.iteye.com/blog/682933

《Flex与ActionScript3程序开发》 10.4 ToolTip组件

 

 

附:我的 《Flex与ActionScript3程序开发》 10.4 ToolTip组件 学习笔记Mindmap:


 

 

  • 大小: 47.1 KB
分享到:
评论

相关推荐

    轻量级 JS ToolTip提示效果

    JS: 代码如下: //—————————tooltip效果 start———————————– //获取某个html元素的定位 function GetPos(obj){ var pos=new Object(); pos.x=obj.offsetLeft; pos.y=obj.offsetTop; while(obj=...

    WXA-ToolTip-微信小程序-ToolTip信息提示组件.zip

    微信小程序-ToolTip信息提示组件导入将ToolTip文件夹复制到pages文件夹内使用在需要使用ToolTip的页面对应的.wxml文件中添加: src="../ToolTip/toolTip.wxml"/> <!-- 引入toolTip模板 -->  is=...

    HTML5/CSS3提示框Tooltip动画

    之前我们已经分享过一款HTML5/CSS3分步提示框Tooltip ,不过这款...今天我们要分享一款利用CSS3实现的提示框Tooltip动画。当鼠标移到图标按钮上时,就会在按钮正上方弹出一个Tooltip提示框,并且伴有淡入淡出的效果。

    Flex tree项目行上加toolTip提示(两种实现方式)

    有时候tree节点内容太长,就需要用toolTip来实现鼠标滑过时提示全部内容。用两种方式实现. 1.通过itemRollOver和itemRollOut,使用ToolTipManager自定义实现 2.树本身属性showDataTips,加了一些小优化。 ...

    HTML5/CSS3分步提示框Tooltip 可嵌入任意HTML元素

    Tooltip又叫提示框,在网页上很常见,用户通过点击或者滑动鼠标来获取更详细的信息,但是整个页面却很整洁。今天分享的这款HTML5/CSS3分步提示框Tooltip可以让你分步来了解相关任务。提示框中的内容可以自定义,可以...

    flex tooltip

    NULL 博文链接:https://hb0504511129-126-com.iteye.com/blog/1343847

    jquery tools之tooltip

    jquery tools之tooltip 今天继续jquery tools六大功能的第二个功能——tooltip的学习。

    Flex 自定义ToolTip

    Flex 自定义ToolTip源代码,可以运行的源代码

    v-tooltip:Vue 3的工具提示

    v工具提示 Vue 3工具提示自定义指令目录安装将tooltip.js粘贴到您的src文件夹中,为了清楚起见,我亲自在其中创建了文件夹directives 。下一步是将tooltip.css粘贴到assets文件夹中。拥有所有文件后,打开main.js...

    vb气泡提示的类,文字可换行,只要设置对应的控件即可

    'Dim tooltip As New Class1 'Set tooltip.ParentControl = Text1 '气泡应用于哪个控件(要有Hwnd) 'tooltip.ToolTipTitle = "气泡标题" '气泡标题(不允许换行/字体粗体) 'tooltip.ToolTipText = "气泡内容" & vbCrLf...

    s-tooltip:适用于任何框架(Angular,React,Vue等)或香草JS的易于使用的工具提示Web组件

    script type =" module " src =" https://unpkg.com/@seanwong24/s-tooltip/dist/s-tooltip/s-tooltip.esm.js " > </ script >< script nomodule src =" ...

    react-a11y-tooltip:可访问的React Tooltip组件

    可访问的React Tooltip组件 目录 特征 对呼叫者的完全演示控制(呈现道具)。 易于理解的源代码。 如果需要,您应该能够分叉并做自己的事情。 除解决方案外,还有足够的文档可帮助您理解问题。 它本身不能做什么...

    DevExpress实现自定义TreeListNode的Tooltip的方法

    本文实例展示了DevExpress实现自定义TreeListNode的Tooltip的方法,具体方法如下所示: 主要功能代码如下: /// /// 为节点提供Tooltip /// 说明: /// 1.设置tree.ToolTipController属性 /// 2.ToolTipController...

    jQuery/CSS3带Tooltip的滑杆动画

    今天我们要来分享一款基于jQuery和CSS3的滑杆拖拽动画,并且在滑杆拖动的过程中,上方有一个Tooltip提示框显示当前滑杆拖动的数值,并可以实时计算当前的值。而且这个Tooltip提示框是经过CSS3美化过的,外观十分漂亮...

    simple-tooltip-css:一个简单的工具提示只有 css

    link rel= " stylesheet " type= " text/css " href= " /bower_components/simple-tooltip-css/dist/css/simple-tooltip.min.css " > ` 在你想要的元素上插入属性data-simpletooltip ...

    数据可视化——数据可视化网站(e-charts).zip

    5. **个性化定制**:提供详细的配置选项,允许用户自定义图表的颜色、字体、网格线、图例、tooltip、轴标签、数据标签、动画效果等,以满足特定设计需求和品牌风格。 6. **数据更新动态渲染**:能够实时接收新数据...

    rc-tooltip-React工具提示-React开发

    rc-tooltip-React Tooltip rc-tooltip React Tooltip屏幕快照浏览器支持IE / Edge Firefox Chrome Safari Opera IE 8 +:check_mark:Firefox 31.0+:check_mark:Chrome 31.0+:check_mark:Safari 7.0+:check_mark:Opera...

    WinForm ToolTip使用方法小结

    本文针对WinForm ToolTip使用方法进行实例总结,希望对大家学习C#程序设计有所帮助。具体如下: 程序功能代码如下: using System.Drawing; using System.Windows.Forms; namespace WinFormUtilHelpV2 { /// ///...

    表格单元格自定义ToolTip组件

    表格单元格自定义ToolTip组件,适用所有Flex组件的自定义提示

    DataGrid实现tooltip功能

    DataGrid实现tooltip功能DataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txt

Global site tag (gtag.js) - Google Analytics