Display HTML text in the Spark TextArea

问题:

The Below code is running well...

<?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" >
 <fx:Declarations>
  <mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" />
 </fx:Declarations>
  <s:Panel id="reader" title="Blog Reader" width="500">
  <mx:DataGrid width="485" id="entries" dataProvider="{httpRSS.lastResult.rss.channel.item}" click="{body.htmlText=httpRSS.lastResult.rss.channel.item[entries.selectedIndex].description}">
   <mx:columns>
    <mx:DataGridColumn dataField="title" headerText="TITLE"/>
    <mx:DataGridColumn dataField="pubDate" headerText="Date"/>    
   </mx:columns>
  </mx:DataGrid>
  <mx:TextArea id="body" editable="false" width="485" x="3" y="142" height="155"/>
 </s:Panel>
 <s:Button label="Load" x="10" y="329" click="{httpRSS.send()}"/>
 </s:Application>

But when Textarea is changed to spark Textrea like below

<s:TextArea id="body" editable="false" width="485" x="3" y="142" height="155"/>

Then htmlText doesn't support Spark Textarea. Hence produces error. How does one go about displaying HTML formatted text with spark Text Area Property.

回答1:

If you're using the RichEditableText component instead, you can do it this way using the TextConverter class

var myStr:String = "I contain <b>html</b> tags!";           
myRichEditableText.textFlow = TextConverter.importToFlow(myStr, TextConverter.TEXT_FIELD_HTML_FORMAT);

回答2:

It can be also used in spark textArea:

var myStr:String = "I contain html tags!";
textAarea.textFlow = TextConverter.importToFlow(myStr, TextConverter.TEXT_FIELD_HTML_FORMAT);

This sometime will not work, if the HTML code is big and have some tags that can`t be rendered TextFlowUtil.importFromString(yourHTMLString);

回答3:

Check out the content property in the TextArea docs. Note the example at the end of the page.. it shows how to embed HTML.

回答4:

body.textFlow = TextFlowUtil.importFromString(yourHTMLString);

回答5:

I don't think you can. You should stick to using the Halo TextArea component or you should investigate the Text Layout Framework to accomplish your goals.

回答6:

David Gassner's Flashbuilder 4 & Flex 4 has a section on this. Take a look at TextFlowUtil. If you want to embed the HTML directly into the Spark TextArea (or RichText / RichEditableText), you can use the content tag as a child, then add the p or span tags thereafter - The supported HTML tags are part of the s namespace too.

回答7:

Can also use :

(myTextArea.textDisplay as StyleableTextField).htmlText = text;