hsv_color_pickers 0.3.0

Flutter package for creating customisable Color pickers for HSV Colors.

HSV Color Pickers

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.

The height of the slider is customizable.

The slider thumb is as well completely customizable.

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!! 🎉