Square padding

[alejandrogiubel]

Hi great plugin!. Any way to add a padding to square inside the wheel?

[rydmike]

Thanks @alejandrogiubel !😄 Probably not in current version. Could you perhaps make screenshot with some drawing/mockup indicating where you would like to have some padding capability? What should it look like?

Perhaps it can be added. The wheel is a custom painter, so its certainly possible to draw whatever, just not with a padding widget per say.

---

BTW, finally got V5 of this this released https://pub.dev/packages/flex_color_scheme

[alejandrogiubel]

Hi. Now we have something like this

And we need something like this

Just aesthetic requirements :sweat_smile:

[rydmike]

Nice mockup and I think I got it. Yes I agree that is a nice layout feature to be able to adjust. So like this then? 😄

Notice btw that thumb keeps its relative position when you adjust the shade square padding and the wheel width.

Added border radius adjustment of the shade square too, it was hard coded to 4 dp before.

Releasing version 2.5.0 in a few minutes with two new props as below A new web demo build with these features included is built and published automatically too when I release it.

  /// Padding between shade square inside the hue wheel and inner
  /// side of the wheel.
  ///
  /// Keep it reasonable in relation to wheelDiameter and wheelWidth, values
  /// from 0 to 20 are recommended.
  ///
  /// Defaults to 0 dp.
  final double wheelSquarePadding;

  /// Border radius of the shade square inside the hue wheel.
  ///
  /// Keep it reasonable, the thumb center always goes out to the square box
  /// corner, regardless of this border radius. It is only for visual design,
  /// the edge color shades are in the sharp corner, even if not shown.
  ///
  /// Recommended values 0 to 16.
  ///
  /// Defaults to 4 dp.
  final double wheelSquareBorderRadius;

[tonyrbf96]

@rydmike I think that setting the wheelSquareBorderRadius will cause to lose some important corner colors, like pure white or black.

EDITED

I see the comments, so you noticed 👍🏼

[alejandrogiubel]

@rydmike :flushed: That was unbelievably fast. Thanks for the quick support. That's exactly what we needed :grin:

[rydmike]

You are welcome!

BTW, the rounding does not affect the color.

The thumb still moves all the way to the sharp corner box, even when visually rounded. The color's shade comes from the thumbs relative position in the box, not from the shade actually visually shown behind it, so you get correct color result even if you round the corners a bit visually or as much as you want, they were always rounded to 4dp before.

For example this still becomes white, since you are in the full white shade corner

[rydmike]

Updated WEB demo just updated itself too via GitHub actions release: https://rydmike.com/flexcolorpicker