开发者

How do I get X,Y coordinates of the caret inside a TextArea component?

I googled for almost a day to find the answer to my question, and found an answer here by polygeek:

http://polygeek.com/1826_flex_monitoring-the-position-of-the-cursor-in-a-textarea

This almost works (and is a great solution), but the solution doesn't work when I do: 1). copy and paste multiple-line texts 2). write long and scroll the texts.

I also found another working example at: http://www.victordramba.com/?p=31 (The autocomplete prompt appears when you press ctrl+space right at the caret's position) But an email from its author(Victor Dramba) says he uses monotype fonts to calculate individual character's location, and wouldn't help much.

Is there a way to get multi-line input from a textfiel开发者_Go百科d?


I've written this Helper class which apperently solves your problem (if you use Flex 4):

public class TextAreaHelper
{
    public static function getCaretPosition(ta : TextArea) : Point
    {
        var flowComposer : StandardFlowComposer = StandardFlowComposer(ta.textFlow.flowComposer);
        var absoluteIndex : int = ta.selectionActivePosition;

        var lineIdx : int = flowComposer.findLineIndexAtPosition(absoluteIndex);
        if (lineIdx == flowComposer.numLines)
            lineIdx--;
        var prevLine : TextFlowLine = lineIdx != 0 ? flowComposer.getLineAt(lineIdx - 1) : null;
        var nextLine : TextFlowLine = lineIdx != flowComposer.numLines-1 ? flowComposer.getLineAt(lineIdx + 1) : null

        var result : Rectangle = flowComposer.getLineAt(lineIdx).computePointSelectionRectangle(absoluteIndex, ta, prevLine, nextLine, true);
        if (result)
        {
            var point : Point = new Point(result.x, result.y);
            point.x -= ta.scroller.viewport.horizontalScrollPosition;               
            point.y -= ta.scroller.viewport.verticalScrollPosition;
            return point;
        }
        return null;
    }
}

Here's an example of usage:

:<fx:Script>
    <![CDATA[
        [Bindable]
        private var caretPosition : Point;
        private function textareaSelectionChangeHandler(e : FlexEvent) : void
        {
            updateCaretPosition();
        }
        private function onPossibleScrollPositionChange(e : PropertyChangeEvent) : void
        {
            if (["verticalScrollPosition", "horizontalScrollPosition"].indexOf(e.property) != -1)
            {
                updateCaretPosition();
            }
        }
        private function updateCaretPosition() : void
        {
            caretPosition = TextAreaHelper.getCaretPosition(ta);
            if (caretPosition) caretPosition = ta.localToGlobal(caretPosition);
            trace(ObjectUtil.toString(caretPosition));
        }

        private function initTextArea() : void
        {
            ta.addEventListener(FlexEvent.SELECTION_CHANGE, textareaSelectionChangeHandler);
            ta.textDisplay.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE, onPossibleScrollPositionChange);
        }

    ]]>
</fx:Script>
<s:TextArea x="200" y="300" id="ta" creationComplete="initTextArea()" />

<s:Rect x="{caretPosition.x}" y="{caretPosition.y}" width="10" height="10" visible="{caretPosition != null}">
    <s:fill>
        <s:SolidColor color="yellow" />
    </s:fill>
</s:Rect>


This is a single way, the tab characters are marked as one character...

public class TextAreaEx extends TextArea 
{       
    ...     

        public function getCaretPosition() : Point
        {
            var pos : int = selectionActivePosition;
            var tx:String = text;
            var p:Point = new Point(pos+1, 1);
            for(var i:int=pos-1; i>0; i--) 
            {
                if (tx.charAt(i) == '\n') 
                {
                    if (p.y==1)
                        p.x = pos-i;
                    p.y++;
                }
            }
            return p;
        }       

}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜