Flex 4中如何设置TextFlow内超链接样式的例子

By Minidxer | October 29, 2009

接下来的例子演示了Flex 4中如何通过linkNormalFormat, linkHoverFormat和linkActiveFormat属性,设置TextFlow内超链接样式。

让我们先来看一下Demo可以点击这里察看源代码):


下面是完整代码(或点击这里察看):
下面是main.mxml:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!-- http://blog.flexexamples.com/2009/06/28/styling-hyperlinks-in-a-textflow-object-in-flex-4/ -->
  3. <s:Application name="Spark_TextArea_textFlow_linkHoverFormat_test"
  4.         xmlns:fx="http://ns.adobe.com/mxml/2009" 
  5.         xmlns:s="library://ns.adobe.com/flex/spark"
  6.         xmlns:mx="library://ns.adobe.com/flex/halo">
  7.  
  8.     <fx:Script>
  9.         <![CDATA[
  10.             import flashx.textLayout.formats.WhiteSpaceCollapse;
  11.             import spark.utils.TextFlowUtil;
  12.  
  13.             XML.ignoreWhitespace = false;
  14.         ]]>
  15.     </fx:Script>
  16.  
  17.     <fx:Declarations>
  18.         <fx:String id="markup" source="teaserTextFlow.xml" />
  19.     </fx:Declarations>
  20.  
  21.     <s:TextArea id="txtArea"
  22.             textFlow="{TextFlowUtil.importFromString(markup, WhiteSpaceCollapse.PRESERVE)}"
  23.             editable="false"
  24.             width="400"
  25.             horizontalCenter="0"
  26.             verticalCenter="0" />
  27.  
  28. </s:Application>

接下来是teaserTextFlow.xml的代码:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TextFlow xmlns="http://ns.adobe.com/textLayout/2008" whiteSpaceCollapse="preserve" fontSize="16" paragraphSpaceAfter="15" paddingTop="4" paddingLeft="4">
  3.     <linkNormalFormat color="#0000ff" textDecoration="underline" />
  4.     <linkHoverFormat color="#ff0000" textDecoration="underline" />
  5.     <linkActiveFormat color="#ff00ff" textDecoration="underline" />
  6.     <format id="code" backgroundColor="#000000" backgroundAlpha="0.1" fontFamily="_typewriter" />
  7.     <p fontWeight="bold">The following excerpt is from <a href="http://blog.flexexamples.com/" target="_self">Flex Examples</a>:</p>
  8.     <p>The following example shows how you can import a TextFlow object from an XML object in Flex 4 by using the static <span format="code">TextFlowUtil.importFromXML()</span> method.</p>
  9.     <p>For more information, see <a href="http://blog.flexexamples.com/2009/06/25/importing-a-text-flow-from-an-xml-object-in-flex-4/">"Importing a text flow from an XML object in Flex 4"</a>.</p>
  10. </TextFlow>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: Gumbo, TextFlow | No Comments » | Tags: , , , , , ,

Search Posts