diff --git a/CHANGELOG.md b/CHANGELOG.md index 3ec52c3..026e1fc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # CHANGELOG +## [0.3.5] + +* [#25](https://github.com/mchome/flutter_colorpicker/pull/25) Add MultipleChoiceBlockPicker. + (Thanks [rostIvan](https://github.com/rostIvan)) + ## [0.3.4] * [#20](https://github.com/mchome/flutter_colorpicker/pull/20) Added null control for availableColors parameter. diff --git a/README.md b/README.md index 99b40c9..eb17764 100644 --- a/README.md +++ b/README.md @@ -46,6 +46,11 @@ showDialog( // pickerColor: currentColor, // onColorChanged: changeColor, // ), + // + // child: MultipleChoiceBlockPicker( + // pickerColors: currentColors, + // onColorsChanged: changeColors, + // ), ), actions: [ FlatButton( diff --git a/example/lib/main.dart b/example/lib/main.dart index c01d093..06b9980 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -17,8 +17,10 @@ class MyApp extends StatefulWidget { class _MyAppState extends State { bool lightTheme = true; Color currentColor = Colors.limeAccent; + List currentColors = [Colors.limeAccent, Colors.green]; void changeColor(Color color) => setState(() => currentColor = color); + void changeColors(List colors) => setState(() => currentColors = colors); @override Widget build(BuildContext context) { @@ -103,7 +105,7 @@ class _MyAppState extends State { showLabel: false, showIndicator: true, indicatorBorderRadius: - const BorderRadius.vertical( + const BorderRadius.vertical( top: const Radius.circular(25.0), ), ), @@ -149,29 +151,58 @@ class _MyAppState extends State { ), ), Center( - child: RaisedButton( - elevation: 3.0, - onPressed: () { - showDialog( - context: context, - builder: (BuildContext context) { - return AlertDialog( - title: Text('Select a color'), - content: SingleChildScrollView( - child: BlockPicker( - pickerColor: currentColor, - onColorChanged: changeColor, - ), - ), - ); - }, - ); - }, - child: const Text('Change me'), - color: currentColor, - textColor: useWhiteForeground(currentColor) - ? const Color(0xffffffff) - : const Color(0xff000000), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + RaisedButton( + elevation: 3.0, + onPressed: () { + showDialog( + context: context, + builder: (BuildContext context) { + return AlertDialog( + title: Text('Select a color'), + content: SingleChildScrollView( + child: BlockPicker( + pickerColor: currentColor, + onColorChanged: changeColor, + ), + ), + ); + }, + ); + }, + child: const Text('Change me'), + color: currentColor, + textColor: useWhiteForeground(currentColor) + ? const Color(0xffffffff) + : const Color(0xff000000), + ), + RaisedButton( + elevation: 3.0, + onPressed: () { + showDialog( + context: context, + builder: (BuildContext context) { + return AlertDialog( + title: Text('Select colors'), + content: SingleChildScrollView( + child: MultipleChoiceBlockPicker( + pickerColors: currentColors, + onColorsChanged: changeColors, + ), + ), + ); + }, + ); + }, + child: const Text('Change me again'), + color: currentColor, + textColor: useWhiteForeground(currentColor) + ? const Color(0xffffffff) + : const Color(0xff000000), + ) + ] ), ), ], diff --git a/lib/src/block_picker.dart b/lib/src/block_picker.dart index 2dc4f77..6fe47dc 100644 --- a/lib/src/block_picker.dart +++ b/lib/src/block_picker.dart @@ -127,3 +127,54 @@ class _BlockPickerState extends State { ); } } + +class MultipleChoiceBlockPicker extends StatefulWidget { + const MultipleChoiceBlockPicker({ + @required this.pickerColors, + @required this.onColorsChanged, + this.availableColors = _defaultColors, + this.layoutBuilder = BlockPicker.defaultLayoutBuilder, + this.itemBuilder = BlockPicker.defaultItemBuilder, + }); + + final List pickerColors; + final ValueChanged> onColorsChanged; + final List availableColors; + final PickerLayoutBuilder layoutBuilder; + final PickerItemBuilder itemBuilder; + + @override + State createState() => _MultipleChoiceBlockPickerState(); +} + +class _MultipleChoiceBlockPickerState extends State { + List _currentColors; + + @override + void initState() { + _currentColors = widget.pickerColors; + super.initState(); + } + + void toggleColor(Color color) { + setState(() { + _currentColors.contains(color) + ? _currentColors.remove(color) + : _currentColors.add(color); + }); + widget.onColorsChanged(_currentColors); + } + + @override + Widget build(BuildContext context) { + return widget.layoutBuilder( + context, + widget.availableColors, + (Color color, [bool _, Function __]) => widget.itemBuilder( + color, + _currentColors.contains(color), + () => toggleColor(color), + ), + ); + } +} diff --git a/pubspec.yaml b/pubspec.yaml index 9a6a895..79f5016 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: flutter_colorpicker description: A HSV(HSB)/HSL color picker inspired by chrome devtools and a material color picker for your flutter app. -version: 0.3.4 +version: 0.3.5 homepage: https://github.com/mchome/flutter_colorpicker dependencies: