Flex4之为ToolTip设置旋转特效及字体

最新推荐文章于 2021-08-04 16:44:08 发布

最新推荐文章于 2021-08-04 16:44:08 发布 · 123 阅读

文章标签：

#Flex #Adobe #XML

RIA-Flex4专栏专栏收录该内容

43 篇文章

订阅专栏

本文介绍如何在Flex中为ToolTip添加动画效果，通过设置ToolTipManager的showEffect和hideEffect属性，结合Rotate和Zoom效果对象实现。同时展示了如何通过StyleManager自定义ToolTip的样式。

没想到ToolTip一个提示标签也可以加上动画，看来Flex真是无所不能啊

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="init()" minWidth="955" minHeight="600">
	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
		<mx:Rotate id="rotate" /> 
		<mx:Zoom id="zoom" /> 
	</fx:Declarations>
	<fx:Style>
		@namespace s "library://ns.adobe.com/flex/spark";
		@namespace mx "library://ns.adobe.com/flex/mx";
		mx|ToolTip{
		 fontSize:20;
		}
	</fx:Style>
	<fx:Script>
		<![CDATA[
			import mx.managers.ToolTipManager; 
			
			private function init():void { 
				ToolTipManager.hideDelay = 2000; 
				ToolTipManager.showEffect = rotate; 
				ToolTipManager.hideEffect = zoom; 
			} 

		]]>
	</fx:Script>
	
	<mx:Button label="鼠标移到我身上"   toolTip="旋转的tooltip" /> 
</s:Application>

关于字体样式设计还可以这样写，在初始化方法中调用，记住如果是在fx:style中设置，那么要加上命名空间，如果是写代码形式的则要加上对应类名的全限定名

StyleManager.getStyleDeclaration("mx.controls.ToolTip").setStyle("fontStyle","italic");
StyleManager.getStyleDeclaration("mx.controls.ToolTip").setStyle("fontSize","20");
StyleManager.getStyleDeclaration("mx.controls.ToolTip").setStyle("fontFamily","Arial");
StyleManager.getStyleDeclaration("mx.controls.ToolTip").setStyle("color","blue");
StyleManager.getStyleDeclaration("mx.controls.ToolTip").setStyle("backgroundColor","#33CC99");

赶紧将代码贴过去吧，看看特效