Flex中如何在TextArea中使用Tab Stops的例子

By Minidxer | July 4, 2009

接下来的例子演示了Flex中如何通过在tabStops属性上设置TextFormat对象,defaultTextFormat属性以及setTextFormat()函数,在TextArea中使用Tab Stops。

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


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

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="TextArea_tabStops_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:Script>
  9.         <![CDATA[
  10.             private function init1():void {
  11.                 var tf:TextFormat = new TextFormat();
  12.                 tf.tabStops = [100, 200, 300, 400];
  13.  
  14.                 textArea1.mx_internal::getTextField().setTextFormat(tf);
  15.             }
  16.  
  17.             private function init3():void {
  18.                 textArea3.htmlText = "<TEXTFORMAT TABSTOPS='100,200,300,400'><P>The quick<TAB/>brown fox<TAB/>jumps over<TAB/>the lazy<TAB/>dog.</P><P>The<TAB/>quick brown<TAB/>fox jumps<TAB/>over the<TAB/>lazy dog.</P></TEXTFORMAT>";
  19.             }
  20.  
  21.             private function init4():void {
  22.                 var tf:TextFormat = new TextFormat();
  23.                 tf.tabStops = [100, 200, 300, 400];
  24.  
  25.                 textArea4.mx_internal::getTextField().defaultTextFormat = tf;
  26.                 textArea4.text = "The quick\tbrown fox\tjumps over\tthe lazy\tdog.\nThe\tquick brown\tfox jumps\tover the\tlazy dog.";
  27.  
  28.                 textArea4.validateNow();
  29.                 trace(textArea4.htmlText);
  30.             }
  31.         ]]>
  32.     </mx:Script>
  33.  
  34.     <mx:TextArea id="textArea1"
  35.             condenseWhite="true"
  36.             width="500"
  37.             creationComplete="init1();">
  38.         <mx:htmlText>
  39.             <![CDATA[
  40.                 <p>The quick<tab/>brown fox<tab/>jumps over<tab/>the lazy<tab/>dog.</p><p>The<tab/>quick brown<tab/>fox jumps<tab/>over the<tab/>lazy dog.</p>
  41.             ]]>
  42.         </mx:htmlText>
  43.     </mx:TextArea>
  44.  
  45.     <mx:TextArea id="textArea2"
  46.             condenseWhite="true"
  47.             width="500">
  48.         <mx:htmlText>
  49.             <![CDATA[
  50.                 <TEXTFORMAT TABSTOPS="100,200,300,400"><P>The quick<TAB/>brown fox<TAB/>jumps over<TAB/>the lazy<TAB/>dog.</P><P>The<TAB/>quick brown<TAB/>fox jumps<TAB/>over the<TAB/>lazy dog.</P></TEXTFORMAT>
  51.             ]]>
  52.         </mx:htmlText>
  53.     </mx:TextArea>
  54.  
  55.     <mx:TextArea id="textArea3"
  56.             condenseWhite="true"
  57.             width="500"
  58.             initialize="init3();" />
  59.  
  60.     <mx:TextArea id="textArea4"
  61.             width="500"
  62.             initialize="init4();" />
  63.  
  64. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: TextArea | No Comments » | Tags: , , , , , ,

Search Posts