hsv_color_pickers 0.2.1 icon indicating copy to clipboard operation
hsv_color_pickers: ^0.2.1 copied to clipboard

Flutter package for creating customisable Color pickers for HSV Colors.

HSV Color Pickers #

gallerize pub.dev analysis

Flutter package for creating customisable Color pickers for HSV Colors.

Hue Picker #

The HuePicker is used to let the user pick the hue of a HSVColor by selecting it on the slider.

Hue Slider 1

The height of the slider is customizable.
Hue Slider 2

The slider thumb is as well completely customizable.
Hue Slider 3

Usage #

Using initialColor

HuePicker(
  initialColor: HSVColor.fromColor(Colors.green),
  onChanged: (HSVColor color) {
      // do something with color
  },
)

Using controller

// create controller
_controller = HueController(HSVColor.fromColor(Colors.green));

// use controller in HuePicker
HuePicker(
  controller: _controller,
  onChanged: (HSVColor color) {
      // do something with color
  },
)

// use controller to set the value of the HuePicker from outside the widget
_controller.value = HSVColor.fromColor(Colors.blue);

Customize #

Customize the slider's height using trackHeight:

HuePicker(
  ...
  trackHeight: 50,
)

Customize the thumb by passing a thumbOverlayColor and a custom thumbShape:

HuePicker(
  ...
  thumbOverlayColor: Colors.green.withOpacity(0.3),
  thumbShape: HueSliderThumbShape(
    color: Colors.black,
    strokeWidth: 8,
    filled: false,
    showBorder: true
  ),
)

HueSliderThumbShape offers the following properties for customisation:

  • radius: the radius of the thumb (double)
  • filled: whether the thumb should be filled or not (bool)
  • color: main color of the thumb
  • strokeWidth: stroke with for non-filled thumb (double)
  • showBorder: whether to show the border or not (bool)
  • borderColor: color of the border, if shown
  • borderWidth: stroke with of the border, if shown (double)

Coming soon... #

  • Saturation Picker
  • Brightness Picker

Contribute #

If you have any ideas for extending this package or have found a bug, please contribute!

  1. You'll need a GitHub account.
  2. Fork the hsv_color_pickers repository.
  3. Work on your feature/bug.
  4. Create a pull request.
  5. Star this project. ⭐
  6. Become a hero!! 🎉
10
likes
130
pub points
75%
popularity

Publisher

verified publisher iconwiefel.dev

Flutter package for creating customisable Color pickers for HSV Colors.

Repository (GitHub)

Documentation

API reference

License

Icon for licenses.BSD-3-Clause (LICENSE)

Dependencies

flutter

More

Packages that depend on hsv_color_pickers