fleather icon indicating copy to clipboard operation
fleather copied to clipboard

Wrong cursor position When Mixing RTL and LTR Text

Open bcmehdi8 opened this issue 1 year ago • 2 comments

I notice an issue of wrong cursor positioning when writing arabic (RTL) with any other LTR language, the cursor issue is related only to LTR text, the cursor should be in the beginning of the LTR word when typing LTR text rather than the end of the word

This issue appear while Direction is set to RTL and TextAlignment set to Right

Here's the issue on Latest fleather demo

https://github.com/fleather-editor/fleather/assets/44551268/b40b58e7-5443-4815-b9c3-6c708d63f712

Here's an example of how the cursor should behave around LTR words

https://github.com/fleather-editor/fleather/assets/44551268/c55119c1-3d7d-48eb-b7d3-59820b6b73b3

Environment

  • Android 14
  • Flutter version 3.19.4
  • Fleather version 1.14.2

Thanks for this Amazing package!

bcmehdi8 avatar Mar 27 '24 03:03 bcmehdi8

Thanks for creating the issues! I have to say I'm not text editing expert, but there seems to be no standard for it and it's rather a design choice in different platforms and rich text editing softwares. Here are some examples:

Flutter's TextField on iOS: Screenshot 2024-04-11 at 16 47 42

Flutter's TextField on Android: Screenshot 2024-04-11 at 16 49 17

Flutter's TextField on Web (macOS): Screenshot 2024-04-11 at 16 57 12

Microsoft Word on macOS: Screenshot 2024-04-11 at 16 35 38

Google Docs (Web): Screenshot 2024-04-11 at 16 38 49

Apple Notes on macOS: Screenshot 2024-04-11 at 16 39 47

It seems like our editor behaves the same as Flutter's TextField but that doesn't necessarily mean it's the correct behavior and it has to be this way. Both way of painting cursor have advantages and disadvantages. When cursor is painted at the end of line (leftmost) when user types an RTL character it would be inserted where cursor was but if types LTR it will be inserted in the end of LTR text part and not where the cursor was.

Do you have any thoughts or proposal for this? @bcmehdi8

Amir-P avatar Apr 11 '24 13:04 Amir-P

A few references to look at:

  • https://marijnhaverbeke.nl/blog/cursor-in-bidi-text.html
  • https://medium.com/phrase-engineering/handling-bi-directional-text-web-editor-d4a543d1a3b1
  • http://www.unicode.org/reports/tr9

Amir-P avatar Apr 12 '24 16:04 Amir-P

Closing as there were no activities.

Amir-P avatar Aug 23 '24 11:08 Amir-P