Skip to content

Conversation

@markusaksli-nc
Copy link
Contributor

@markusaksli-nc markusaksli-nc commented May 20, 2022

Hides the text selection toolbar on Android and iOS when dragging the text selection handles. Shows it again after the dragging ends. There seems to be a 300ms delay on Android after the toolbar is shown again (couldn't find a spec for this).

The precise timing for this behavior is likely complicated by #17617 still missing from both platforms.

Fixes #62193

Pre-launch Checklist

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
  • I signed the CLA.
  • I listed at least one issue that this PR fixes in the description above.
  • I updated/added relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or this PR is test-exempt.
  • All existing and new tests are passing.

@flutter-dashboard flutter-dashboard bot added a: text input Entering text in a text field or keyboard related problems framework flutter/packages/flutter repository. See also f: labels. labels May 20, 2022
@markusaksli-nc markusaksli-nc force-pushed the handle-hide-toolbar branch 3 times, most recently from 185cb35 to 50a7ecf Compare May 20, 2022 19:20
@flutter-dashboard flutter-dashboard bot added the f: material design flutter/packages/flutter/material repository. label May 20, 2022
@justinmc justinmc requested a review from antholeole May 23, 2022 22:59
Copy link
Contributor

@justinmc justinmc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for fixing this @markusaksli-nc! Some comments below but overall I like the approach.

Also, probably should be a separate PR, but I think Android also hides the handle that is being dragged but Flutter does not?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you add a comment like this about where you got this value? "Eyeballed on a physical Android <model e.g. Pixel 6 etc.> device."

That way we know if/when/how we need to update it if someone notices it doesn't match.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried counting frames on a Pixel 5 emulator recording but I'm not sure if the 20fps rate lines up with the exact timing or not (42ms of error?) so it's pretty much eyeballing still.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What happens if you don't make this change?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The 300ms android timer doesn't get dismissed and test fails due to remaining timer. I thought canceling it in dispose should fix this but doesn't work here even though it fixed other test failures. Any ideas?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah maybe you have to manually call selectionOverlay.dispose() in this test? Try that.

@markusaksli-nc
Copy link
Contributor Author

markusaksli-nc commented May 24, 2022

@justinmc Updated based on the feedback.

About hiding the handle it depends on the magnifier position when using Pixel 5 with Android 12. The magnifier hides the dragged handle and the other handle if it overlaps it in Files search bar, Google Chrome search bar, etc where the magnifier is displayed inline with the text. When the magnifier is above the text (where the toolbar usually is) neither handle is hidden in Messages or in the basic EditText, the dragged handle is still hidden in Google Sign-in though, seemingly inconsistent usage.

But noticed some other fidelity issues compared to Android EditText.

Details

Pixel 5 Android 12 - Android EditText

  • magnifier
  • selects word when adding to selection
  • vibrates when selection changes
API31-native.mp4

SM-S908B Android 12, One UI 4.1 - Android EditText

This has a bunch of wild and wacky additions:

  • no magnifier?
  • selects word when adding to selection
  • vibrates when selection changes
  • overdragable handles decoupled from selection position
  • moveable context menu
  • handles scale when dragged
S908B-native.mp4

Pixel 5 and SM-S908B (exactly the same) - Flutter TextField

  • magnifier not implemented
  • doesn't select word when adding to selection
  • no vibration
  • outdated selection toolbar
API31-flutter.mp4

@markusaksli-nc markusaksli-nc requested a review from justinmc May 25, 2022 15:13
@markusaksli-nc markusaksli-nc force-pushed the handle-hide-toolbar branch 3 times, most recently from c1e5f94 to 0dd27fd Compare May 30, 2022 15:10
Copy link
Contributor

@justinmc justinmc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See if my comment below solves the problem with the lingering timer, otherwise this looks ready to merge.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah maybe you have to manually call selectionOverlay.dispose() in this test? Try that.

@fluttergithubbot fluttergithubbot merged commit 4ec4c24 into flutter:master Jun 2, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 2, 2022
zanderso added a commit that referenced this pull request Jun 2, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 3, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2022
markusaksli-nc added a commit that referenced this pull request Jun 4, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 6, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 6, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 6, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 6, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 6, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 7, 2022
camsim99 pushed a commit to camsim99/flutter that referenced this pull request Aug 10, 2022
camsim99 pushed a commit to camsim99/flutter that referenced this pull request Aug 10, 2022
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

a: text input Entering text in a text field or keyboard related problems f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Hide selection toolbar on iOS and Android when moving paddles/caret

3 participants