Flex中如何利用getTextField事件和numLines属性，计算出TextArea控件中内容的行数的例子

关于Flex的TextArea控件的例子，前面已经介绍了不少，包括设置该控件文本无效时的颜色，如何利用setSelection事件设定文本选中范围，如何利用htmlText属性以及condenseWhite属性紧缩HTML空格……等等，可以直接点TextArea Tag查看–WordPress的Tag功能，其实是非常不错。

接下来的例子，演示了Flex中如何利用getTextField事件和numLines属性，计算出TextArea控件中内容的行数。

让我们先来看一下Demo

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">

<mx:Script>

<![CDATA[

import mx.utils.StringUtil;

private function textArea_change(evt:Event):void {

callLater(updateStats, [evt]);

}

private function updateStats(evt:Event):void {

var nLines:uint = textArea.mx_internal::getTextField().numLines;

var nChars:uint = textArea.length;

var str:String = "{0} characters; {1} lines";

panel.status = StringUtil.substitute(str,

nChars,

nLines);

}

]]>

</mx:Script>

<mx:String id="str" source="lorem.txt" />

<mx:ApplicationControlBar dock="true">

<mx:Form styleName="plain">

<mx:FormItem label="width (%):">

<mx:HSlider id="slider"

minimum="50"

maximum="100"

value="100"

liveDragging="true"

snapInterval="1"

tickInterval="10" />

</mx:FormItem>

</mx:Form>

</mx:ApplicationControlBar>

<mx:Panel id="panel"

percentWidth="{slider.value}"

height="100%">

<mx:TextArea id="textArea"

htmlText="{str}"

condenseWhite="true"

width="100%"

height="100%"

change="textArea_change(event);"

resize="textArea_change(event);" />

</mx:Panel>

</mx:Application>