Flex 3快速入门: 构建简单的用户界面 使用工具提示

本文介绍如何在Adobe Flex中使用工具提示来增强用户体验。通过设置组件的toolTip属性,可以为用户提供有关组件功能的信息。文章还提供了如何使用MXML和CSS自定义工具提示样式的方法。

使用工具提示


Adobe® Flex™ ToolTip 使您能够为您的用户提供有帮助的信息。当用户在图形组件上移动鼠标指针时, 会弹出包含文本信息的工具提示。您可以使用工具提示来指导用户完成使用应用程序或自定义它们来提供其他功能。

扩展 UIComponent 类 (该类实现 IToolTipManagerClient 界面) 的每个可视 Flex 组件都支持 toolTip 属性。您将 toolTip 属性的值设置为一个文本字符串, 并且, 当鼠标指针悬停在该组件上时, 会显示该文本字符串。

尽管长消息很难读取, 但对工具提示文本的大小不存在任何限制。当工具提示文本达到工具提示框的宽度时, 文本会自动换至下一行。可以在工具提示文本中添加换行符。在 ActionScript 中, 您使用 /n 转义的新行字符。在 MXML 标签中, 您使用 
 XML 实体。

可以通过使用层叠样式表 (CSS) 语法或 mx.styles.StyleManager 类更改工具提示文本和工具提示框的外观。对工具提示样式的更改适用于当前应用程序中的所有工具提示。

示例


<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    viewSourceURL="src/UsingTooltips/index.html"
    width="400" height="170"
>
    <mx:Style>
        ToolTip
        {
            fontFamily: "Arial";
            fontSize: 19;
            fontStyle: "italic";
            color: #FFFFFF;
            backgroundColor: #33CC99;
        }
    </mx:Style>

    <mx:Panel
        title="Using ToolTips"
        toolTip="Child components without &#13; ToolTips will inherit this."
    >   
        <mx:Form>   
            <mx:FormItem label="Button with tooltip:">
                <mx:Button label="Roll over me!" toolTip="You can click me too!" />       
            </mx:FormItem>

            <mx:FormItem label="Button without tooltip:">
                <mx:Button label="I&apos;m unoriginal" />       
            </mx:FormItem>
        </mx:Form>
    </mx:Panel>   

</mx:Application>

本文来自:http://www.airia.cn/FLEX_Directory/using_tooltips/

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值