Creating a TextFlow object with the TextFlowUtil class

If you don’t know the rich text that you want to display until run-time, you can import HTML or XML to a TextFlow object. The TextFlowUtil class has the following methods that let you add XML and strings as the contents of a TextFlow object:

  • importFromString()

  • importFromXML()

The following example uses the importFromString() method to load a String object into the TextFlow:
<?xml version="1.0"?>
<!-- sparktextcontrols/TextFlowMarkup.mxml -->
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"    
    xmlns:mx="library://ns.adobe.com/flex/mx"     
    xmlns:s="library://ns.adobe.com/flex/spark"
    creationComplete="doSomething()">
    <s:layout> 
        <s:VerticalLayout/> 
    </s:layout>

    <fx:Script><![CDATA[
        import flashx.textLayout.elements.TextFlow;
        import spark.utils.TextFlowUtil;
        
        private function doSomething():void {
            var markup:String = "<p>This is paragraph 1.</p><p>This is paragraph 2.</p>"; 
            var flow:TextFlow = TextFlowUtil.importFromString(markup);
            myST.textFlow = flow;
        }
    ]]></fx:Script>

    <s:RichText id="myST" width="175"/>

</s:Application>
The executing SWF file for the previous example is shown below:
You can add also import XML by using the TextFlowUtil class’s importFromXML() method. Any XML that uses valid TLF markup can be passed into a TextFlow. This includes content returned by an HTTPService call, XML defined in the application file itself, or XML defined in an external file.
The following example uses an external file that defines a TextFlow object for a text control: 
<?xml version="1.0" encoding="utf-8"?>
<!-- sparktextcontrols/ExternalXMLFile.mxml -->
<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/mx">
 
    <fx:Script>
        <![CDATA[
            import spark.utils.TextFlowUtil;
 
            XML.ignoreWhitespace = false;
        ]]>
    </fx:Script>
 
    <fx:Declarations>
        <fx:XML id="textFlowAsXML" source="externalTextFlow1.xml" />
    </fx:Declarations>
 
    <s:RichText id="richTxt"
            textFlow="{TextFlowUtil.importFromXML(textFlowAsXML)}"
            horizontalCenter="0" verticalCenter="0" />
 
</s:Application>
The executing SWF file for the previous example is shown below:
The previous example uses the following file:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/08/11/setting-text-in-a-spark-richtext-control-in-flex-4/ -->
<TextFlow xmlns="http://ns.adobe.com/textLayout/2008" whiteSpaceCollapse="preserve">
    <p><span>The quick brown </span> <span fontWeight="bold">fox jumps over</span> <span> the lazy dogg.</span></p>
</TextFlow>

If the first tag in an imported XML object is not a <s:TextFlow> tag, then the parser inserts one for you. If the first tag is a <s:TextFlow> tag, then you must also define the "http://ns.adobe.com/textLayout/2008" namespace in that tag.

The parser converts the TLF tags to TLF classes (such as SpanElement or DivElement) in the new TextFlow object.

This example used with permission from http://blog.flexexamples.com.