Chinaunix首页 | 论坛 | 博客
  • 博客访问: 92674
  • 博文数量: 41
  • 博客积分: 2650
  • 博客等级: 少校
  • 技术积分: 680
  • 用 户 组: 普通用户
  • 注册时间: 2008-06-23 16:26
文章分类

全部博文(41)

文章存档

2011年(1)

2008年(40)

我的朋友

分类:

2008-06-24 15:36:57


ToolTips宽度

    你可以通过更改maxWidth这个属性来改变ToolTip框的宽度。这个属性是静态的,所以当你设置的时候,你是设置所有的ToolTip框,你不能在ToolTip类的实力上设置次属性。

maxWidth这个属性制定了ToolTip框最大的显示宽度(pixels为单位的)。比如设置其为100piexels

xmlns:mx="" creationComplete="init()">

import mx.controls.ToolTip;

public function init():void {

ToolTip.maxWidth = 100;

}

public function createNewButton(event:MouseEvent):void {

var myButton:Button = new Button();

myButton.label = "Create Another Button";

myButton.toolTip = "Click this new button to create another button.";

myButton.addEventListener(MouseEvent.CLICK, createNewButton);

addChild(myButton);

}

]]>

id="b1"

label="Create Another Button"

click="createNewButton(event);"

toolTip="Click this button to create a new one."

/>

Flex会把ToolTip的文字换行以确保文字显示宽度不会超过设置的宽度值。maxWidth的默认值为300. 假如这个值超过了application的宽度,那么Flex将会剪短ToolTip box中的显示文字。

事件的使用

ToolTip的生命周期中会触发很多事件,这些事件都是ToolTipEvent类型的。

除了typetarget两个属性外,ToolTipEvent对象涉及到了toolTip属性。利用这个属性,就可以通过text属性拿到ToolTip里面的文本内容值。

要在中使用ToolTipEvent类型的事件,你必须import mx.events.ToolTipEvent 类。以下是一个TOOL_TIP_SHOW事件的例子用来播放mp3文件的:

xmlns:mx="" initialize="init()">

import mx.events.ToolTipEvent;

import flash.media.Sound;

[Embed(source="../assets/sound1.mp3")]

private var beepSound:Class;

private var myClip:Sound;

public function playSound():void {

myClip.play();

}

private function myListener(event:ToolTipEvent):void {

playSound();

}

private function init():void {

myLabel.addEventListener(ToolTipEvent.TOOL_TIP_SHOW, myListener);

myClip = new beepSound();

}

]]>

id="myLabel" toolTip="ToolTip" text="Mouse Over Me"/>

      NavBar控件使用ToolTips

NavBarTabBar子类在data provider中支持ToolTips Data provider 数组中可以包含ToolTip来为navigator 项指定toolTip。举个例子:

xmlns:mx="">

label="OK" toolTip="OK Button ToolTip"/>

label="Cancel" toolTip="Cancel Button ToolTip"/>

         你也可以通过设置NavBartoolTipField属性值来指向data provider中提供的toolTip

xmlns:mx="">

toolTipField="myToolTip">

label="OK" myToolTip="OK Button TooTip"/>

label="Cancel" myToolTip="Cancel Button ToolTip"/>

    ToolTip 管理器

使用ToolTipManager管理器类能够让你设置基本的ToolTip功能。比如显示延迟,以及控制是否显示ToolTip信息内容。这些全部包含在mx.managers包里面。当你要使用ToolTipManager的时候必须导入这个类。ToolTipManager这个类同时也包含了涉及当前ToolTipcurrentToolTip属性。

ToolTips

你可以在程序中激活和停止使用ToolTips. 当你停止使用,在鼠标移到到组件上方的时候就不会用ToolTips的框显示出来,不管那个组件是否设置了toolTip这个属性值。

你可以使用enabled这个属性来激活或者停止使用ToolTips。这个属性为true时为激活状态,false为停止使用状态,默认是true.

xmlns:mx="">

import mx.managers.ToolTipManager;

private function toggleToolTips():void {

if (ToolTipManager.enabled) {

ToolTipManager.enabled = false;

} else {

ToolTipManager.enabled = true;

}

}

]]>

id="b1"

label="Toggle ToolTips"

width="150"

click="toggleToolTips();"

toolTip="Click me to enable/disable tooltips."

/>

延迟时间是来来衡量某一时间发生前所消耗的时间。比如,在用户移动鼠标指针到组件的上方,在ToolTip显示之前有一个简短的延迟。这就给那些不想看到ToolTip内容的用户足够的时间,在看到ToolTip信息之前把鼠标移开。

ToolTipManager 可以允许你设置这个ToolTip显示延迟的时间的长度,以及ToolTip在屏幕上显示的事件长度。你还可以设置ToolTips之间的延迟时间。

你可以在ActionScript的代码块中设置ToolTipManager的这些属性值:showDealy,hideDelayscrubDelay。具体的功能描述请参考官方的develop guide。以下是一个例子利用Application k控制的初始化方法来设置ToolTip的初始值。

xmlns:mx="" creationComplete="initApp();">

import mx.managers.ToolTipManager;

private function initApp():void {

ToolTipManager.enabled = true;// Optional. Default value is true.

ToolTipManager.showDelay = 0;// Display immediately.

ToolTipManager.hideDelay = 3000; // Hide after 3 seconds of being viewed.

}

]]>

label="Click Me" toolTip="Click this Button to do something."/>

label="Click Me" toolTip="Click this Button to do something else."/>

label="Click Me" toolTip="Click this Button to do a third thing."/>

label="Click Me" toolTip="Click this Button to do the same thing."/>

ToolTip视觉效果

你可以使用自定义的视觉效果或者标准的Flex效果。你可以设置ToolTipManagershowEffect或者hideEffect属性值来定义当ToolTip显示或者隐藏是所触发的效果。

以下就是使用退出(Fade)的效果:

xmlns:mx="" width="600" height="600"

initialize="app_init();">

import mx.managers.ToolTipManager;

public function app_init():void {

ToolTipManager.showEffect = fadeIn;

}

]]>

id="fadeIn" alphaFrom="0" alphaTo="1" duration="1000"/>

id="b1" label="Click Me" toolTip="This is a ToolTip that fades in."/>

例子当中的默认字体并没有退出的效果,你可以使用嵌入式(embeded)的字体来达到这个效果。

假如你为hideEffect设置了退出的这种效果,用户必须等到鼠标移动到这些组件的上方才能触发效果。如果用户的鼠标在ToolTip对象自动隐藏之前移动到不同的组件,hideToolTip事件就不会被触发。

ToolTip

你不仅可是使用ToolTips静态的显示文本信息的功能,还可以使用ToolTips动态的绑定组件中的内容来动态显示ToolTips信息。这样可以让你ToolTips成为用户界面的一部分。给用户给多的个性化的体验。

你可以使用{}绑定ToolTips的值到另外一个组件的文本内容。以下的例子就是插入TextInput控件的文本值到按钮控件的ToolTips值。

xmlns:mx="">

id="txtTo" width="300"/>

label="Send" toolTip="Send e-mail to {txtTo.text}"/>

另外一个方法就是获取ToolTipstoolTipShow事件处理来改变text属性值。以下就是一个通过myToolTipChanger方法来监听按钮控件的toolTipShow事件,然后在这个方法内修改了ToolTipManager.currentToolTip.text属性。这个属性值在运行前是未知的。

xmlns:mx="" initialize="initApp()">

import mx.managers.ToolTipManager;

import mx.controls.ToolTip;

import mx.events.ToolTipEvent;

public function initApp():void {

b1.addEventListener(ToolTipEvent.TOOL_TIP_SHOW, myToolTipChanger)

}

public function myToolTipChanger(event:ToolTipEvent):void {

// Pass the value of myName in to your application in some way.

// For example, as a flashVar variable.

ToolTipManager.currentToolTip.text = "Click the button, " +

Application.application.parameters.myName;

}

]]>

id="b1" label="Click Me" toolTip="Click the button."/>

阅读(618) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~