All Projects → mchome → Flutter_colorpicker

mchome / Flutter_colorpicker

Licence: mit
A HSV(HSB)/HSL color picker inspired by chrome devtools and a material color picker for your flutter app.

Programming Languages

dart
5743 projects

Projects that are alternatives of or similar to Flutter colorpicker

vscode-color
Helper with GUI to generate color codes such as CSS color notations.
Stars: ✭ 88 (-52.43%)
Mutual labels:  color-picker, hsl
Gmdjs
Grid Material Design
Stars: ✭ 24 (-87.03%)
Mutual labels:  material, grid
ColorPicker
Customizable Color Picker control for WPF
Stars: ✭ 57 (-69.19%)
Mutual labels:  color-picker, hsl
andColorPicker
Color picker library for Android
Stars: ✭ 233 (+25.95%)
Mutual labels:  color-picker, hsl
Smart Webcomponents
Web Components & Custom Elements for Professional Web Applications
Stars: ✭ 110 (-40.54%)
Mutual labels:  material, grid
Color Studio
It is too hard to build coherent and accessible themes with the right colors. This should help.
Stars: ✭ 289 (+56.22%)
Mutual labels:  hsl, color-picker
Md2
Angular2 based Material Design components, directives and services are Accordion, Autocomplete, Collapse, Colorpicker, Datepicker, Dialog(Modal), Menu, Multiselect, Select, Tabs, Tags(Chips), Toast and Tooltip.
Stars: ✭ 389 (+110.27%)
Mutual labels:  material, color-picker
Hsluv Dart
Dart port of HSLuv, a human-friendly alternative to HSL based on human experiments.
Stars: ✭ 49 (-73.51%)
Mutual labels:  hsl, color-picker
Colors App
🎨 A PWA for copying values from popular color palettes. Supports HEX, RGB, and HSL formats.
Stars: ✭ 90 (-51.35%)
Mutual labels:  material, color-picker
Hsl color picker
HSL Color Picker for Sketch (no longer maintenance).
Stars: ✭ 88 (-52.43%)
Mutual labels:  hsl, color-picker
Primereact
The Most Complete React UI Component Library
Stars: ✭ 2,393 (+1193.51%)
Mutual labels:  material, grid
Ngrid
A angular grid for the enterprise
Stars: ✭ 157 (-15.14%)
Mutual labels:  material, grid
React Colorpickr
A themeable colorpicker with HSL and RGB support for React
Stars: ✭ 180 (-2.7%)
Mutual labels:  hsl, color-picker
React Mdc Web
Material Design Components for React
Stars: ✭ 175 (-5.41%)
Mutual labels:  material
Jeffrey Way Theme
Jeffrey Way's theme on Laracasts. Example: https://laracasts.com/series/whats-new-in-laravel-5-1/episodes/2.
Stars: ✭ 180 (-2.7%)
Mutual labels:  material
Angular Handsontable
Angular Data Grid with Spreadsheet Look & Feel. Official Angular wrapper for Handsontable.
Stars: ✭ 175 (-5.41%)
Mutual labels:  grid
Whitepaper
免费分享区块链白皮书,涉及各门各派。内容均来自互联网,如果侵权,请联系删除。 区块链白皮书 weixin:mipengchong
Stars: ✭ 175 (-5.41%)
Mutual labels:  block
Kau
An extensive collection of Kotlin Android Utils
Stars: ✭ 182 (-1.62%)
Mutual labels:  material
Grid
This package has moved and renamed
Stars: ✭ 2,079 (+1023.78%)
Mutual labels:  grid
Polybar Collection
Beautiful collection of Polybar themes
Stars: ✭ 172 (-7.03%)
Mutual labels:  material

flutter_colorpicker

pub package

A HSV(HSB)/HSL color picker inspired by chrome devtools and a material color picker for your flutter app.

Web Example

Getting Started

Use it in [showDialog] widget:

// create some values
Color pickerColor = Color(0xff443a49);
Color currentColor = Color(0xff443a49);

// ValueChanged<Color> callback
void changeColor(Color color) {
  setState(() => pickerColor = color);
}

// raise the [showDialog] widget
showDialog(
  context: context,
  child: AlertDialog(
    title: const Text('Pick a color!'),
    content: SingleChildScrollView(
      child: ColorPicker(
        pickerColor: pickerColor,
        onColorChanged: changeColor,
        showLabel: true,
        pickerAreaHeightPercent: 0.8,
      ),
      // Use Material color picker:
      //
      // child: MaterialPicker(
      //   pickerColor: pickerColor,
      //   onColorChanged: changeColor,
      //   showLabel: true, // only on portrait mode
      // ),
      //
      // Use Block color picker:
      //
      // child: BlockPicker(
      //   pickerColor: currentColor,
      //   onColorChanged: changeColor,
      // ),
      //
      // child: MultipleChoiceBlockPicker(
      //   pickerColors: currentColors,
      //   onColorsChanged: changeColors,
      // ),
    ),
    actions: <Widget>[
      FlatButton(
        child: const Text('Got it'),
        onPressed: () {
          setState(() => currentColor = pickerColor);
          Navigator.of(context).pop();
        },
      ),
    ],
  ),
)

preview SlidePicker

Details in example/ folder.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].