Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Scrollbar behavior for mobile devices #72531

Merged
merged 9 commits into from Dec 17, 2020

Conversation

Piinks
Copy link
Contributor

@Piinks Piinks commented Dec 17, 2020

Description

Follow-up change to #71664
The new material scrollbar needs a few mobile-specific updates.
First, the scrollbar should be thinner on mobile because of the relative size of the screen.
On Android specifically, we should be matching native instead of Material Design.
Finally, on mobile, we should be ignoring hover events. You can trigger a hover enter event with taps on mobile, but you cannot trigger the hover exit event, which the behaviors of the scrollbar relies on.

Related Issues

Fixes #72202
#70866

Tests

Updated affected tests, added tests for platform specific behaviors.

Checklist

Before you create this PR, confirm that it meets all requirements listed below by checking the relevant checkboxes ([x]). This will ensure a smooth and quick review process.

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I signed the CLA.
  • I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I updated/added relevant documentation (doc comments with ///).
  • All existing and new tests are passing.
  • The analyzer (flutter analyze --flutter-repo) does not report any problems on my PR.
  • I am willing to follow-up on review comments in a timely manner.

Breaking Change

Did any tests fail when you ran them? Please read Handling breaking changes.

  • No, no existing tests failed, so this is not a breaking change.

@Piinks Piinks added framework flutter/packages/flutter repository. See also f: labels. a: fidelity Matching the OEM platforms better f: scrolling Viewports, list views, slivers, etc. labels Dec 17, 2020
@flutter-dashboard flutter-dashboard bot added the f: material design flutter/packages/flutter/material repository. label Dec 17, 2020
@google-cla google-cla bot added the cla: yes label Dec 17, 2020
Copy link
Contributor

@HansMuller HansMuller left a comment

Choose a reason for hiding this comment

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

LGTM

// Hover events not supported on mobile.
child = MouseRegion(
onExit: handleHoverExit,
onHover: handleHover,
Copy link
Member

Choose a reason for hiding this comment

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

We can use PointerEvent.kind to distinguish the type of input device to deal with this issue. Moreover, the mobile phone can also be used with an external mouse. At this time, we can better respond to the hover event.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a: fidelity Matching the OEM platforms better f: material design flutter/packages/flutter/material repository. f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Scrollbar width is way to big compared to native mobile behavior
4 participants