Comments (7)
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
from flex_color_picker.
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;
from flex_color_picker.
Updated WEB demo just updated itself too via GitHub actions release: https://rydmike.com/flexcolorpicker
from flex_color_picker.
@rydmike
😳 That was unbelievably fast. Thanks for the quick support. That's exactly what we needed 😁
from flex_color_picker.
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
from flex_color_picker.
Hi.
Now we have something like this
And we need something like this
Just aesthetic requirements 😅
from flex_color_picker.
@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 👍🏼
from flex_color_picker.
Related Issues (20)
- Support for disabled Colors HOT 3
- The argument type 'double?' can't be assigned to the parameter type 'double' because 'double?' is nullable and 'double' isn't. iconSize: effectiveIconTheme.size, HOT 8
- Swap OK and CANCEL button order on bottom action in built in dialog HOT 1
- BSD 3-Clause License @ mobile app HOT 2
- High wheelWidth cause wrong cursor position in the ColorPicker HOT 2
- Permit or add animations to showPickerDialog HOT 1
- How add greyscale in custon tonal palette? HOT 2
- Add option to change color code format HOT 5
- Get Color Name HOT 5
- `showColorPickerDialog` could reuse the theme when possible HOT 2
- FlexColorPicker Demo Slider issue HOT 4
- White colour selects multiple colour HOT 5
- Inner circle does not move HOT 4
- Transparent as a color option HOT 5
- Support for multiple custom color pickers / palettes HOT 5
- Wheel with enableTonalPalette -> LateInitializationError: Field '_activeColorSwatchList@1082511434' has not been initialized. HOT 4
- feature request: make OK button more intuitive HOT 3
- Add transparency as an option to the wheel picker.
- Missing parameter `surfaceTintColor` in material3 HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from flex_color_picker.