Cursor at the end of the Text

[arpu]

Hey,

working on a basic Cursor blinking at the End of the Text, any Idea what i should do if the maxWidth wrap the Text?
( using totalBlockSize )
( attached small showcast Video)

[lojjic]

@arpu You should use the utility functions for caret and selection positioning described here: https://github.com/protectwise/troika/blob/master/packages/troika-three-text/README.md#carets-and-selection-ranges

Something like: add a listener for the synccomplete event, and in its handler call getSelectionRects passing the string length for both start and end. That should give you back a zero-width rectangle for placing the caret.

And then of course as you improve your text editor you can get caret positions at any place within the string as well. And selection rects too. :)

[arpu]

wau, thx for your fast response! this works fantastic!

[arpu]

@lojjic not sure if this is a bug or a problem on my side, but the getSelectionRects is not updated for a space in the first Line

Peek.2021-02-17.15-42.mp4

[arpu]

all works fine in the second line i get the right position with

 const catBox = getSelectionRects(e.target._textRenderInfo, 0 , this.data.value.length )
 right = catBox[catBox.length-1].right

[lojjic]

Hmm, it looks like getSelectionRects clips the rects to the overall bounds of the rendered glyphs, which may explain what you're seeing. I'll have to give some thought to whether that's the behavior we want or not (I think probably not, but need to make sure.)

In the meantime, you could maybe work around it by accessing textRenderInfo.caretPositions directly?

[lojjic]

Ah I see why I included that clipping, it's to avoid ugly things like this where the selection pokes out the right edge:

But I think it's the wrong approach for handling that, it needs to be smarter. I'll work on it.

[lojjic]

@arpu I've just released a 0.39.1 patch version which I think should fix your issue. Please let me know whether it works.

[arpu]

@lojjic wau! this fixed it for me! thx a lot for fast response!