dart - What is TextAffinity in Flutter?

Question

The TextAffinity enum in Flutter has the following documentation description:

A way to disambiguate a TextPosition when its offset could match two different locations in the rendered string.

For example, at an offset where the rendered text wraps, there are two visual positions that the offset could represent: one prior to the line break (at the end of the first line) and one after the line break (at the start of the second line). A text affinity disambiguates between these two cases.

This affects only line breaks caused by wrapping, not explicit newline characters. For newline characters, the position is fully specified by the offset alone, and there is no ambiguity.

TextAffinity also affects bidirectional text at the interface between LTR and RTL text. Consider the following string, where the lowercase letters will be displayed as LTR and the uppercase letters RTL: "helloHELLO". When rendered, the string would appear visually as "helloOLLEH". An offset of 5 would be ambiguous without a corresponding TextAffinity. Looking at the string in code, the offset represents the position just after the "o" and just before the "H". When rendered, this offset could be either in the middle of the string to the right of the "o" or at the end of the string to the right of the "H".

This kind of makes sense but it's still a little confusing. For example "helloHELLO" isn't actually bidirectional text. How is offset 5 ambiguous? Do you have a visual example?

I'm adding my answer below.

question from:https://stackoverflow.com/questions/66056458/what-is-textaffinity-in-flutter

Answer 1

TextAffinity disambiguates text position for soft wraps and bidirectional text boundaries. The affinity can be either upstream or downstream. Downstream is the default.

Soft wrap position

Given the string 0123456789 whose last character soft-wraps to the next line, you can choose the cursor position as follows. Both positions are at offset 9:

Downstream

Upstream

Bidirectional text boundary

Given the string Hello???? where Hello is LRT text and ???? is RTL text, you can choose the cursor position at the boundary between them as follows. Both positions are at offset 5:

Downstream

Upstream

Going on

I write about this in more detail here.