The opacity slider thumb padding broke/changed after upgrading to Flutter 3.27.0

[rydmike]

Before Flutter 3.27.0

Before upgrading to Flutter 3.27.0, the opacity slider in FlexColorPicer behaved like this, when using different track height and thumb sizes:

Screen.Recording.2024-12-13.at.20.52.38.mov

This can be tested and verified with the web demo build made with Flutter version 3.24.3, published here:

https://rydmike.com/flexcolorpicker3-6-0/

After Flutter 3.27.0 upgrade

With Flutter 3.27.0 there is new extra padding around the opacity slider.

Screen.Recording.2024-12-13.at.20.56.27.mov

• The used opacity Slider is discrete, using 255 steps in an opacity range from 0 to 1, where the steps thus correspond to all possible values in the 8-bit Alpha value in a ARGB color value.

  • https://github.com/rydmike/flex_color_picker/blob/master/lib/src/widgets/opacity/opacity_slider.dart

• The used custom slider track OpacitySliderTrack extends SliderTrackShape

  • https://github.com/rydmike/flex_color_picker/blob/master/lib/src/widgets/opacity/opacity_slider_track.dart

• The used custom slider thumb OpacitySliderThumb extends RoundSliderThumbShape

  • https://github.com/rydmike/flex_color_picker/blob/master/lib/src/widgets/opacity/opacity_slider_thumb.dart

Suggested and tried fixes

The following fix was tried together with @TahaTesser

Remove thumbRadius compensation in shapeRect

This removes half of the extra padding, but not all as desired and needed to match the past custom design.

FIX ATTEMPT	CORRECT DESIGN

The fix did not work and it also made the thumb no longer track the mouse and jump when it is pushed:

Screen.Recording.2024-12-13.at.21.22.12.mov

EDIT: This jump on push also happens without the above FIX attempt when using Flutter 3.27.0. It does not happen on the Flutter 3.24.3 build.

---

Fix PRs welcome!

Please submit any fix PRs to https://github.com/rydmike/flex_color_picker

[TahaTesser]

Investigating this. Maybe related to flutter/flutter#161210

[rydmike]

Thanks @TahaTesser your Flutter PR flutter/flutter#161814 should fix this too. I can verify when it has been merged in Flutter master.

[TahaTesser]

Thanks @TahaTesser your Flutter PR flutter/flutter#161814 should fix this too. I can verify when it has been merged in Flutter master.

Here you go!

[rydmike]

Awesome @TahaTesser and good to verify with this case too. The PR has not been merged yet, but soon enough I guess.

Are you going to request a CP for this fix too?

[TahaTesser]

Are you going to request a CP for this fix too?

Don't think so. This is not easily reproducible, it needs certain conditions.