改变RichEditableText的LinkElement颜色并相应函数

在Flex中，需要LinkElement来添加事件监听，但不能改变字体颜色，而SpanElement可以设置字体颜色，但是不能添加监听事件。解决方案就是将二者嵌套，如：

<p>Search for product info on <a><span color="#ff0000">Google</span></a></p>

详细代码如下：

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/08/11/setting-text-in-a-spark-richtext-control-in-flex-4/ -->
<s:Application name="Spark_RichText_text_test"
			   xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/halo" xmlns:local="*">
	
	<fx:Script>
		<![CDATA[
			import flashx.textLayout.conversion.TextConverter;
			import flashx.textLayout.elements.FlowElement;
			import flashx.textLayout.elements.FlowGroupElement;
			import flashx.textLayout.elements.LinkElement;
			import flashx.textLayout.elements.SpanElement;
			import flashx.textLayout.elements.TextFlow;
			import flashx.textLayout.events.FlowElementMouseEvent;
			
			import mx.controls.Alert;
			
			import spark.utils.TextFlowUtil;
			
			protected function button1_clickHandler(event:MouseEvent):void
			{
				// TODO Auto-generated method stub
				var d:String = '<p>The quick brown <span color="#ff0000">fox jumps over</span> the lazy dogg.</p>';
				richTxt.textFlow = TextFlowUtil.importFromString(d);
			}
			
			private function handleClickEvent(e:FlowElementMouseEvent):void {
				Alert.show("dd");
			}   
			
			protected function button2_clickHandler(event:MouseEvent):void
			{
				var d:String = '<p>Search for product info on <a click="handleClickEvent(event)">Google</a></p>';
				richTxt2.textFlow = TextConverter.importToFlow(d, TextConverter.TEXT_FIELD_HTML_FORMAT);
			}
			
			protected function button3_clickHandler(event:MouseEvent):void
			{
				var d:String = '<p>Search for product info on <a><span color="#ff0000">Google</span></a></p>';			
				//var d:String = '<p>Search for product info on <span color="#ff0000">Google</span></p>';
				//richTxt2.textFlow = TextConverter.importToFlow(d, TextConverter.TEXT_FIELD_HTML_FORMAT);
				richTxt3.textFlow = addLinkClickHandler(d, handleClickEvent);
			}
			
			/**
			 * Converts the html string (from the resources) into a TextFlow object
			 * using the TextConverter class. Then it iterates through all the 
			 * elements in the TextFlow until it finds a LinkElement, and adds a 
			 * FlowElementMouseEvent.CLICK event handler to that Link Element.
			 */
			public static function addLinkClickHandler(html:String, 
													   linkClickedHandler:Function):TextFlow {
				//var textFlow:TextFlow = TextConverter.importToFlow(html, TextConverter.TEXT_FIELD_HTML_FORMAT);
				var textFlow:TextFlow = TextFlowUtil.importFromString(html);
				var link:LinkElement = findLinkElement(textFlow);
				if (link != null) {
					link.addEventListener(FlowElementMouseEvent.CLICK, 
						linkClickedHandler, false, 0, true);
				} else {
					trace("Warning - couldn't find link tag in: " + html);
				}
				return textFlow;
			}
			
			/**
			 * Finds the first LinkElement recursively and returns it.
			 */
			private static function findLinkElement(group:FlowGroupElement):LinkElement {
				var childGroups:Array = [];
				// First check all the child elements of the current group,
				// Also save any children that are FlowGroupElement
				for (var i:int = 0; i < group.numChildren; i++) {
					var element:FlowElement = group.getChildAt(i);
					if (element is LinkElement) {
						return (element as LinkElement);
					} else if (element is FlowGroupElement) {
						childGroups.push(element);
					}
				}
				// Recursively check the child FlowGroupElements now
				for (i = 0; i < childGroups.length; i++) {
					var childGroup:FlowGroupElement = childGroups[i];
					var link:LinkElement = findLinkElement(childGroup);
					if (link != null) {
						return link;
					}
				}
				return null;
			}
			
			
			
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<fx:String id="htmlTextAsMarkup"><![CDATA[<p>The quick brown <span fontWeight="bold">fox jumps over</span> the lazy dogg.</p>]]></fx:String>
	</fx:Declarations>	

	<s:RichText id="richTxt"
				horizontalCenter="0" verticalCenter="0" />
	<s:Button x="34" y="32" label="richtext" click="button1_clickHandler(event)"/>
	
	<s:RichEditableText top="70" editable="false" focusEnabled="false"  id="richTxt2">
	</s:RichEditableText>
	<local:HtmlLabel id="richTxt3" top="100">
		
	</local:HtmlLabel>
	<s:Button x="130" y="32" label="RichEditableText" click="button2_clickHandler(event)"/>
	<s:Button x="258" y="32" label="htmlLabel" click="button3_clickHandler(event)"/>
	
</s:Application>

 组件HtmlLabel的代码如下：

<?xml version="1.0" encoding="utf-8"?>
<s:RichEditableText xmlns:fx="http://ns.adobe.com/mxml/2009"
					xmlns:s="library://ns.adobe.com/flex/spark"
					xmlns:mx="library://ns.adobe.com/flex/mx"
					focusEnabled="false"
					selectable="false"
					editable="false">
	
	<fx:Script>
		<![CDATA[
			import flashx.textLayout.conversion.TextConverter;
			
			override public function set text(value:String):void {
				super.textFlow = TextConverter.importToFlow(value, 
					TextConverter.TEXT_FIELD_HTML_FORMAT);
			}
		]]>
	</fx:Script>
	
</s:RichEditableText>

 运行结果“Google”字符串字体变为红色，如下所示：