更改a:TextArea的内容后奇怪的滚动

时间:2011-08-04 14:16:36

标签: flex flex4

我对Flex 4.1中TextArea的滚动行为有一个奇怪的问题。请考虑以下代码,以在TextArea内容的行结尾中显示¶:

    [Bindable]
    public var text:String;

    public var applied:Boolean = false;

    protected function apply(event:MouseEvent):void
    {
        if (!applied)
        {   
            text = text.replace(/\n/g,"¶\n");
            applied = true;
        }
        else
        {
            text = text.replace(/¶\n/g, "\n");
            applied = false;
        }
    }
...
<s:VGroup>      
    <s:TextArea height="200" width="200" text="@{text}"/>
    <s:Button enabled="true" label="go!" click="apply(event)"/>
</s:VGroup>

当我第一次按下按钮时,会将十字线添加到文本中。我除了看到由于自动换行而移动了几行,但TextArea对文本中一个非常遥远的位置进行了太大的“跳跃”。似乎这是组件中的一个问题 - 有时跳转是包含文本开头的事件。如果我随后使用按钮添加或删除了pilcrows,则滚动似乎没问题。

您是否有任何想法如何在不经历内容周围如此奇怪的跳跃的情况下对TextArea的文本进行正则表达式替换? 提前谢谢!

1 个答案:

答案 0 :(得分:1)

我测试了你提供的代码,并没有注意到TextArea的滚动位置有任何奇怪的“跳跃”。

但是,如果您需要手动更改滚动位置以保持某一点(例如TextArea的顶部),您可以在应用pilcrows之后始终更新文本区域的滚动位置属性:

protected function apply(event:MouseEvent):void
    {
        if (!applied)
        {   
            text = text.replace(/\n/g,"¶\n");
            applied = true;
            textArea.scroller.verticalScrollBar.value = 0; //Set to the desired scroll position
        }
        else
        {
            text = text.replace(/¶\n/g, "\n");
            applied = false;
            textArea.scroller.verticalScrollBar.value = 0;
        }
    }

...
<s:VGroup>      
    <s:TextArea id="textArea" height="200" width="200" text="@{text}"/>
    <s:Button enabled="true" label="go!" click="apply(event)"/>
</s:VGroup>