[SuperEditor][SuperTextField][mobile] Do not crop magnifier at screen edges (Resolves #2167)

[angelosilvestre]

[SuperEditor][SuperTextField][mobile] Do not crop magnifier at screen edges. Resolves #2167

Currently, our magnifiers aren't confined within the screen edges:

SuperEditor Android

Super Editor iOS

Constraining the magnifier to screen edges should be as simple as applying a ScreenFollowerBoundary to the Follower. However, we use a FractionalTranslation to align the Follower and this doesn't seem to play nicely with ScreenFollowerBoundary. We can see in the following video that the aligner uses the position before the transformation to constrain it:

android_magnifier.webm

To make it work correctly, I had to get rid of the FractionalTranslation. It took a bit of trial and error to make adjust the magnifier transformations to make it correctly center the magnified content. Some of our offsets were not accounting for the device pixel ratio, so I also adjusted them.

There are some places that we are still not using follow_the_leader, so I also modified those places.

Results:

android_magnifier_edges.webm

Simulator.Screen.Recording.-.iPhone.15.Plus.-.2024-12-31.at.09.12.10.mp4

[angelosilvestre]

@matthew-carroll I had to add some tolerance to the goldens added in this PR, because they are always failing with some pixel diff in the CI.

[matthew-carroll]

Only comment is that it's not clear to me why we're adding (1 * width) and (1 * heigh) back to the value. We should find some way to explain this in the comment above. Also, to make that fact very clear, we should probably change the translation to:

-(size.width * magnificationScale / 2) + (size.width / 2)

I believe that's the same equation.

[angelosilvestre]

In fact, the calculation can be:

-(size.width - (size.width * magnificationScale / 2))

or

(size.width / 2) - (size.width * magnificationScale / 2)

or

 -(size.width * magnificationScale - size.width) / 2

I think the last one is the easiest to understand.

[angelosilvestre]

@matthew-carroll It seems the test "keeps current selection when tapping on caret" from the previous PR started to fail. In a place where we call tapInParagraph Flutter is not firing the tap event.

It seems that, somehow, we are trying to tap while the magnifier is running the exit animation, and the tap is being reported to the magnifier instead of the editor. I modified the test to call pumpAndSettle, but we could also wrap the magnifier with an IgnorePointer.

[matthew-carroll]

It seems that, somehow, we are trying to tap while the magnifier is running the exit animation, and the tap is being reported to the magnifier instead of the editor.

Why not place an IgnorePointer around the magnifier?

[angelosilvestre]

@matthew-carroll No particular reason. Updated to do that.

[matthew-carroll]

LGTM