Flex 4 - Highlight keywords in a block of text using TextLine
- by Baz
I have a search and results page that I would like to highlight the keywords that were searched for, in the text of the results. It was suggested that I use TextLine for this, but I am having trouble figuring out how to make it work. I started a simple, compilable dummy application and was hoping someone could give me some tips on how to continue:
<?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"
initialize="initApp();">
<fx:Script>
import flash.display.Sprite;
import flash.text.engine.*;
private var textLine:TextLine;
private function initApp():void {
var normalFormat:ElementFormat = new ElementFormat(null, 12, 0x000000);
var highlightFormat:ElementFormat = new ElementFormat(null, 14, 0xff0000);
var textBlock:TextBlock = new TextBlock(new TextElement("This is text that has KEYWORDS. I would like to highlight these KEYWORDS by changing their font color and adding a light yellow background graphic.", normalFormat));
textLine = textBlock.createTextLine();
textLine.y = 100;
embeddedFontHolder.addChild(textLine);
}
</fx:Script>
<mx:UIComponent width="100%" id="embeddedFontHolder" />
</s:Application>
Anyone have any ideas?
Cheers,
Baz
