Skip to content

Fix RangeSlider thumb overlay remains visible after touch interaction ends - #12560

Merged
auto-submit[bot] merged 8 commits into
flutter:mainfrom
KarthikManikuttan:port-range-slider-189610
Aug 24, 2026
Merged

Fix RangeSlider thumb overlay remains visible after touch interaction ends#12560
auto-submit[bot] merged 8 commits into
flutter:mainfrom
KarthikManikuttan:port-range-slider-189610

Conversation

@KarthikManikuttan

@KarthikManikuttanKarthikManikuttan commented Aug 23, 2026•
edited by QuncCccccc
Loading

Copy link
Copy Markdown
Contributor

Ports flutter/flutter#189610 to material_ui, per the porting instructions in flutter/flutter#188444.

Fixesflutter/flutter#189205

After a RangeSlider thumb was touched or dragged, the selected thumb could retain focus and continue painting the focused overlay after the touch gesture ended. This happened because the focused thumb requested keyboard focus during pointer interaction, and RangeSlider painted its focused overlay directly from FocusNode.hasFocus.

This PR separates actual thumb focus from the visual focus highlight. Touch interaction can still move focus to the selected thumb for semantics and keyboard continuation, but the focused overlay is only painted when Flutter's focus highlight mode says it should be shown, such as keyboard/traditional focus.

This PR also fixes the active drag overlay disappearing while a touch gesture is still in progress. Previously, if the finger moved outside the thumb's overlay bounds during a drag, hover tracking could reverse the shared overlay animation even though the slider was still active. The overlay now remains visible for the active drag and dismisses when the interaction ends.

Original PR: flutter/flutter#189610

Pre-Review Checklist

  • I read the [Contributor Guide] and followed the process outlined there for submitting PRs.
  • I read the [AI contribution guidelines] and understand my responsibilities, or I am not using AI tools.
  • I read the [Tree Hygiene] page, which explains my responsibilities.
  • I read and followed the [relevant style guides] and ran [the auto-formatter].
  • I signed the [CLA].
  • The title of the PR starts with the name of the package surrounded by square brackets, e.g. [shared_preferences]
  • I [linked to at least one issue that this PR fixes] in the description above.
  • I followed [the version and CHANGELOG instructions], using [semantic versioning] and the [repository CHANGELOG style], or I have commented below to indicate which documented exception this PR falls under[^1].
  • I updated/added any relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or I have commented below to indicate which [test exemption] this PR falls under[^1].
  • All existing and new tests are passing.

@github-actionsgithub-actionsBot added p: material_ui triage-design Should be looked at in design triage labels Aug 23, 2026
gemini-code-assist[bot]
gemini-code-assistBot reviewed Aug 23, 2026
View reviewed changes

@gemini-code-assistgemini-code-assistBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Code Review

This pull request updates the RangeSlider component to manage focus highlights for individual thumbs using FocusableActionDetector. It introduces state variables and handlers for start and end thumb focus highlights, updates the widget states to include WidgetState.focused when focused, and ensures the active drag overlay remains visible during an in-progress drag even if the pointer moves outside the thumb bounds. Additionally, corresponding unit tests and a changelog entry have been added. There are no review comments, so no feedback is provided.

@KarthikManikuttan

KarthikManikuttan commented Aug 23, 2026

Copy link
Copy Markdown
ContributorAuthor

@Piinks could you take a look at this when you get a chance, or route it to the right reviewer? This is a port of flutter/flutter#189610 (already reviewed/approved by @QuncCccccc and @victorsanni there) — flagging for triage given the decoupling coordination in flutter/flutter#188444.

@Piinks

Piinks commented Aug 24, 2026

Copy link
Copy Markdown
Contributor

@KarthikManikuttan please avoid pinging people directly and allow the triage process to pick this up.

QuncCccccc
QuncCccccc approved these changes Aug 24, 2026
View reviewed changes

@QuncCcccccQuncCccccc left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM. Thanks for porting it over:)

@QuncCcccccQuncCccccc added the CICD Run CI/CD label Aug 24, 2026
@flutter-dashboardflutter-dashboardBot removed the CICD Run CI/CD label Aug 24, 2026
@KarthikManikuttan

KarthikManikuttan commented Aug 24, 2026

Copy link
Copy Markdown
ContributorAuthor

@QuncCccccc thanks for the review 🙂

@QuncCcccccQuncCccccc added the CICD Run CI/CD label Aug 24, 2026
Piinks
Piinks approved these changes Aug 24, 2026
View reviewed changes

@PiinksPiinks left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM too! Thank you!

@PiinksPiinks added the autosubmit Merge PR when tree becomes green via auto submit App label Aug 24, 2026
@auto-submit
auto-submitBot merged commit 994fff1 into flutter:mainAug 24, 2026
14 checks passed
@KarthikManikuttan

KarthikManikuttan commented Aug 25, 2026

Copy link
Copy Markdown
ContributorAuthor

@Piinks Thank you 😊

This was referenced Aug 25, 2026
Closed
Merged
zijiehe-google-com pushed a commit to zijiehe-google-com/flutter that referenced this pull request Aug 25, 2026
@engine-flutter-autoroll
Roll Packages from df2ba94faea6 to 740f09361ccc (17 revisions) (flutt…
15d8908
…er#191734)
flutter/packages@df2ba94...740f093
2026-08-25 srawlins@google.com [cupertino_ui] Remove unused parameters
from constructors of generic classes. (flutter/packages#12457)
2026-08-25 srawlins@google.com [material_ui] Remove unused parameters
from constructors of generic classes. (flutter/packages#12458)
2026-08-25 6655696+guidezpl@users.noreply.github.com Ignore shared code
for iOS platform implementation of Google Maps plugin
(flutter/packages#12529)
2026-08-25 136096126+glitchfl@users.noreply.github.com [cross_file]
fixed `readAsString` decoding in-memory bytes as UTF-16
(flutter/packages#12479)
2026-08-25 lozhkovoi@gmail.com [cupertino_ui] Remove two items assert to
allow CupertinoTabBar to have one tab (flutter/packages#12546)
2026-08-25 huahua8893@sina.cn [cupertino_ui] Fix covered sheet revealing
root route through top gap (flutter/packages#12530)
2026-08-25 fluttergithubbot@gmail.com Sync release-go_router-18.0.0 to
main (flutter/packages#12575)
2026-08-25 fluttergithubbot@gmail.com Sync release-material_ui-1.1.0 to
main (flutter/packages#12577)
2026-08-25 fluttergithubbot@gmail.com Sync release-cupertino_ui-1.0.1 to
main (flutter/packages#12576)
2026-08-24 41930132+hellohuanlin@users.noreply.github.com
[quick_actions_ios]unskip XCUITests (flutter/packages#12436)
2026-08-24 karthimanikuttan001@gmail.com Fix RangeSlider thumb overlay
remains visible after touch interaction ends (flutter/packages#12560)
2026-08-24 victor.orozco@cloudsufi.com [google_sign_in] Increase iOS
coverage tests (flutter/packages#12484)
2026-08-24 269567208+reidbaker-agent@users.noreply.github.com
[camera_android_camerax] Migrate from dart_skills_lint to skills_lint
(flutter/packages#12543)
2026-08-24 74037732+developerashkan@users.noreply.github.com [go_router]
Clarify onEnter/redirect ordering, add regression test
(flutter/packages#12337)
2026-08-24 brunocorona.alcantar@gmail.com [material_ui] Port
flutter/flutter flutter#185149 "Slider label clips the screen"
(flutter/packages#12572)
2026-08-24 engine-flutter-autoroll@skia.org Roll Flutter from
65c9a8d to 9a82789 (17 revisions) (flutter/packages#12578)
2026-08-24 stuartmorgan@google.com [tool] Fix dart_test.yaml parsing
(flutter/packages#12574)
If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-packages-flutter-autoroll
Please CC flutter-ecosystem@google.com on the revert to ensure that a
human
is aware of the problem.
To file a bug in Flutter:
https://github.com/flutter/flutter/issues/new/choose
To report a problem with the AutoRoller itself, please file a bug:
https://issues.skia.org/issues/new?component=1389291&template=1850622
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@PiinksPiinksPiinks approved these changes
@QuncCcccccQuncCcccccQuncCccccc approved these changes
+1 more reviewer
@gemini-code-assistgemini-code-assist[bot]gemini-code-assist[bot] left review comments
Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

autosubmitMerge PR when tree becomes green via auto submit AppCICDRun CI/CDp: material_uitriage-designShould be looked at in design triage

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

RangeSlider thumb overlay remains visible after touch interaction ends on mobile

3 participants

@KarthikManikuttan@Piinks@QuncCccccc