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;
}
}
精彩评论