`

Flex HtmlButton 控件

    博客分类:
  • Flex
阅读更多
package com
{
	import flash.events.Event;
	import flash.text.TextLineMetrics;
	import mx.controls.Button;
	import mx.core.UITextField;
	import mx.core.mx_internal;
	use namespace mx_internal;
	
	public class HtmlButton extends Button
	{
		/**
		 *  @private
		 *  Storage for the htmlText property.
		 */
		private var _htmlLabel:String;
		
		/**
		 *  @private
		 *  The value of the unscaledWidth parameter during the most recent
		 *  call to DisplayList
		 */
		private var oldUnscaledWidth:Number;
		
		/**
		 *  @private
		 *  This flag indicate htmlText changed for this component
		 */
		private var htmlLabelChanged:Boolean;
		
		/**
		 *  @private
		 *  This flag indicate style changed for this component
		 */         
		private var styleChangedFlag:Boolean = true;
		
		/**
		 *  @private
		 *  This flag indicate tooltip set for this component
		 */
		private var toolTipSet:Boolean = false;
		
		/** 
		 *  @private
		 *  This label setter override for  htmlLabel property with null
		 */
		override public function set label(value:String):void
		{
			super.label = value;
			
			if (super.label != value)
				_htmlLabel = null;
		}
		
		override public function get label():String
		{
			if(isHTML)
				return _htmlLabel;
			return super.label;
		}
		
		[Bindable("htmlLabelChanged")]
		[CollapseWhiteSpace]
		[Inspectable(category="General", defaultValue="")]
		/**
		 *  Specifies the text displayed by the Button control, including HTML markup that
		 *  expresses the styles of that text. 
		 *  When you specify HTML text in this property, you can use the subset of HTML 
		 *  tags that is supported by the Flash TextField control.
		 */
		public function get htmlLabel():String
		{
			return _htmlLabel;
		}
		
		
		/**
		 * @private
		 */
		public function set htmlLabel(value:String):void
		{
			if (_htmlLabel != value)
			{
				_htmlLabel = value;
				
				label = null;
				
				htmlLabelChanged = true;
				
				invalidateSize();
				invalidateDisplayList();
				
				dispatchEvent(new Event("htmlLabelChanged"));
			}
		}
		
		/** 
		 *  @private
		 *  This label setter override for  toolTipSet property for this component
		 */
		override public function set toolTip(value:String):void
		{
			super.toolTip = value;
			
			if (value)
				toolTipSet = true;
			else
				toolTipSet = false;
		}
		
		/**
		 *  @private
		 */
		private function get isHTML():Boolean
		{
			return _htmlLabel != null;
		}
		
		/**
		 *  @private
		 */
		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
		{
			super.updateDisplayList(unscaledWidth,unscaledHeight);
			
			// If our width changed, reset the label text to get it to fit.
			if (isHTML && 
				(oldUnscaledWidth > unscaledWidth ||
					textField.htmlText != htmlLabel ||
					htmlLabelChanged||
					styleChangedFlag))
			{
				textField.htmlText = _htmlLabel;
				var lineMetrics:TextLineMetrics= measureHTMLText(_htmlLabel);
				var d:Boolean = (lineMetrics.width + UITextField.TEXT_WIDTH_PADDING) > textField.width;
				
				if (!toolTipSet)
				{
					if (d)
						super.toolTip = textField.text;
					else
						super.toolTip = null;
				}            
			}
			
			oldUnscaledWidth = unscaledWidth;
			htmlLabelChanged = false;
			styleChangedFlag = false;
		}
		
		/**
		 *  @private
		 *  This function overrited only for  styleChangedFlag
		 */
		override public function styleChanged(styleProp:String):void
		{
			styleChangedFlag = true;
			
			super.styleChanged(styleProp);        
		}
		
		/**
		 * This overrited function return TextLineMetrics based on htmlLabel property.
		 * If htmlLabel is not null, its return TextLineMetrics for htmlLabel.
		 * Otherwiset its return TextLineMetrics for label. 
		 */
		override public function measureText(text:String):TextLineMetrics
		{
			if(isHTML)
				return super.measureHTMLText(text);
			
			return super.measureText(text);
		}
	}
} 


<com:HtmlButton x="235" y="130">
		<com:htmlLabel> <![CDATA[Hello<Font color="#FF0000">WorLd0000000</Font>]]></com:htmlLabel>
	</com:HtmlButton>

分享到:
评论

相关推荐

    flex基本控件总结

    除了上述控件,还有菜单控件(Menu controls)、按钮控件(Button controls)和其他Flex控件(Flex controls)以及容器控件,这些控件提供了丰富的交互性和视觉效果,如Button、List、Accordion、TabNavigator等,...

    Flex 3 控件实例全部

    你可以通过访问 http://examples.adobe.com/flex3/componentexplorer/explorer.html 来在线查看这些控件的实际效果。 在 Flex 3 中,`Visual Components` 或视窗控件是一类可以显示在应用程序中的可视化元素,用于...

    Flex常规控件和组件

    在 Flex 中,控件和组件是构建用户界面的基本元素,它们提供了多种功能和样式,以满足不同需求。下面将详细介绍这些常规的 Flex 控件和组件: 1. Button:Button 是最基本的动作触发器,用于响应用户的单击事件。它...

    FLEX网站源码 FLEX网站源码 FLEX网站源码

    4. **Flex组件库**:Flex提供了一套丰富的预定义组件,如Button、TextInput、List等,可以快速构建用户界面。通过自定义组件,开发者可以扩展这些基础组件以满足特定需求。 5. **数据绑定**:Flex中的数据绑定机制...

    flex的资料 api

    例如,`mx.controls`包下的Button、Label、TextInput等控件,以及`mx.events`中的Event类和Dispatcher类,都是开发者经常使用的API。 2. **安装版和网页版**:Flex SDK(Software Development Kit)的安装版包含了...

    Flex课程学习(附带源码)

    flex + MyEclipse的配置和使用 http://wenku.baidu.com/view/f9ede23a0912a21614792988.html Flex + java 项目搭建 http://wenku.baidu.com/view/9b4b5f29647d27284b7351c4.html j2ee搭建flex环境 ...

    flex 给ImageMap添加描点,事件,并动态加载ImageMap 控件

    在Flex开发中,ImageMap控件是一个非常实用的组件,它允许开发者创建可交互的图像映射,类似于HTML中的 imagemap。在这个主题中,我们将深入探讨如何在Flex中为ImageMap添加描点、绑定事件以及如何动态加载ImageMap...

    FLex文档教程

    1. **控件**:包括基于文本的控件(如Label、Text、TextInput、TextArea和RichTextEditor)、基于按钮的控件(如Button、LinkButton、CheckBox、RadioButton和PopupButton)等。这些控件用于实现各种用户交互功能,...

    flex 超牛的验证码flex 超牛的验证码flex 超牛的验证码

    MXML是Flex的应用程序和用户界面的主要标记语言,类似于HTML,但专为Flex应用程序设计。ActionScript则是Flex的编程语言,用于实现业务逻辑和动态行为。 ### 3. 验证码的实现原理 验证码是一种常见的安全措施,...

    Flex中文帮助

    1. **Flex Framework**:包含了创建RIA所需的各种组件,如容器、控件、数据绑定等。 2. **MXML**:一种基于XML的标记语言,用于定义Flex应用程序的结构和布局。 3. **ActionScript 3.0**:基于ECMAScript的脚本...

    Flex中文基础教程

    1. **Flex Framework**:Adobe Flex 2 Framework 包含了创建RIA所需的所有组件,包括容器、控件、数据绑定、数据格式化等。 2. **MXML**:一种基于XML的语言,用于定义Flex应用程序的界面结构和样式。 3. **...

    fle中textarea控件中html文本显示与转换

    根据给定的信息,本文将详细解析在Flex框架中如何处理`textarea`控件中的HTML文本显示与转换。Flex是一款强大的RIA(Rich Internet Application)开发工具,由Adobe公司维护,广泛应用于构建高性能、交互丰富的Web...

    flex 经典教程下载

    在MXML中,你可以声明基本控件如Button、Image、Label等,并通过ActionScript实现它们的功能。 **动态效果** Flex 提供了多种动态效果,如移动(move)、旋转(rotate)、放大(zoom)和淡入淡出(fade)。这些效果...

    学习Flex做的几个小程序。

    - 描述中的“控件的简单应用”可能包括了如Button、Label、TextInput等基本组件的使用。 3. **数据绑定** - Flex支持双向数据绑定,这意味着UI组件的状态可以自动反映模型数据的变化,反之亦然。这简化了应用状态...

    b.rar_flex

    5. Components:Flex库包含了一系列预定义的组件,如Button、Label、List等,可以方便地拖放到MXML设计视图中。 6. States和Skinning:Flex允许为不同状态(如normal、hover、disabled)定义组件的外观,以及自定义...

    flex_教程.doc

    - **基于按钮的控件**:如Button、LinkButton、CheckBox、RadioButton和PopupButton等。这些控件通常用于触发特定的操作或收集用户的选项选择。 ##### 2. 加入基于列表的控件并获取数据 - **基于列表的控件**:...

    基于jQuery的Spin Button自定义文本框数值自增或自减(测试案例)

    display: flex; align-items: center; } .btn-decrement, .btn-increment { padding: 5px 10px; border: 1px solid #ccc; cursor: pointer; } ``` 3. **jQuery 实现**: 接下来,我们需要编写jQuery代码...

    Flex4创建页面

    - 例如,通过 `&lt;fx:Bindings source="empDg.selectedItem as Employee" destination="employee" /&gt;` 可以实现在某个状态中根据DataGrid的选择项更新其他控件的数据。 #### 三、关键代码解读 以下是一段关键代码的...

Global site tag (gtag.js) - Google Analytics