fix: format flutter_colorpicker to fix CI failure, update the android example project to use latest version of Kotlin, fix AndroidManifest string resources

pull/1874/head
Ellet 11 months ago
parent bd2b3a2b4c
commit 7aa261a746
  1. 4
      example/android/app/build.gradle
  2. 2
      example/android/app/src/main/AndroidManifest.xml
  3. 3
      example/android/settings.gradle
  4. 1
      example/devtools_options.yaml
  5. 41
      lib/src/packages/flutter_colorpicker/src/block_picker.dart
  6. 171
      lib/src/packages/flutter_colorpicker/src/colorpicker.dart
  7. 3
      lib/src/packages/flutter_colorpicker/src/colors.dart
  8. 126
      lib/src/packages/flutter_colorpicker/src/material_picker.dart
  9. 274
      lib/src/packages/flutter_colorpicker/src/palette.dart
  10. 15
      lib/src/packages/flutter_colorpicker/src/utils.dart
  11. 3
      lib/src/widgets/toolbar/buttons/color/color_dialog.dart

@ -35,7 +35,7 @@ android {
defaultConfig { defaultConfig {
applicationId = "com.example.example" applicationId = "com.example.example"
minSdk = flutter.minSdkVersion minSdk = 23
targetSdk = flutter.targetSdkVersion targetSdk = flutter.targetSdkVersion
versionCode = flutterVersionCode.toInteger() versionCode = flutterVersionCode.toInteger()
versionName = flutterVersionName versionName = flutterVersionName
@ -43,8 +43,6 @@ android {
buildTypes { buildTypes {
release { release {
// TODO: Add your own signing config for the release build.
// Signing with the debug keys for now, so `flutter run --release` works.
signingConfig = signingConfigs.debug signingConfig = signingConfigs.debug
} }
} }

@ -23,7 +23,7 @@
<application <application
android:name="${applicationName}" android:name="${applicationName}"
android:icon="@mipmap/ic_launcher" android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"> android:label="Flutter Quill Example">
<activity <activity
android:name=".MainActivity" android:name=".MainActivity"
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode" android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"

@ -19,7 +19,8 @@ pluginManagement {
plugins { plugins {
id "dev.flutter.flutter-plugin-loader" version "1.0.0" id "dev.flutter.flutter-plugin-loader" version "1.0.0"
id "com.android.application" version "7.3.0" apply false id "com.android.application" version "7.3.0" apply false
id "org.jetbrains.kotlin.android" version "1.7.10" apply false // TODO: We should update the project to not require higher version of Kotlin
id "org.jetbrains.kotlin.android" version "1.9.24" apply false
} }
include ":app" include ":app"

@ -11,10 +11,12 @@ import 'utils.dart';
typedef PickerItem = Widget Function(Color color); typedef PickerItem = Widget Function(Color color);
/// Customize the layout. /// Customize the layout.
typedef PickerLayoutBuilder = Widget Function(BuildContext context, List<Color> colors, PickerItem child); typedef PickerLayoutBuilder = Widget Function(
BuildContext context, List<Color> colors, PickerItem child);
/// Customize the item shape. /// Customize the item shape.
typedef PickerItemBuilder = Widget Function(Color color, bool isCurrentColor, void Function() changeColor); typedef PickerItemBuilder = Widget Function(
Color color, bool isCurrentColor, void Function() changeColor);
// Provide a list of colors for block color picker. // Provide a list of colors for block color picker.
const List<Color> _defaultColors = [ const List<Color> _defaultColors = [
@ -41,7 +43,8 @@ const List<Color> _defaultColors = [
]; ];
// Provide a layout for [BlockPicker]. // Provide a layout for [BlockPicker].
Widget _defaultLayoutBuilder(BuildContext context, List<Color> colors, PickerItem child) { Widget _defaultLayoutBuilder(
BuildContext context, List<Color> colors, PickerItem child) {
Orientation orientation = MediaQuery.of(context).orientation; Orientation orientation = MediaQuery.of(context).orientation;
return SizedBox( return SizedBox(
@ -57,13 +60,19 @@ Widget _defaultLayoutBuilder(BuildContext context, List<Color> colors, PickerIte
} }
// Provide a shape for [BlockPicker]. // Provide a shape for [BlockPicker].
Widget _defaultItemBuilder(Color color, bool isCurrentColor, void Function() changeColor) { Widget _defaultItemBuilder(
Color color, bool isCurrentColor, void Function() changeColor) {
return Container( return Container(
margin: const EdgeInsets.all(7), margin: const EdgeInsets.all(7),
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: color, color: color,
boxShadow: [BoxShadow(color: color.withOpacity(0.8), offset: const Offset(1, 2), blurRadius: 5)], boxShadow: [
BoxShadow(
color: color.withOpacity(0.8),
offset: const Offset(1, 2),
blurRadius: 5)
],
), ),
child: Material( child: Material(
color: Colors.transparent, color: Colors.transparent,
@ -73,7 +82,8 @@ Widget _defaultItemBuilder(Color color, bool isCurrentColor, void Function() cha
child: AnimatedOpacity( child: AnimatedOpacity(
duration: const Duration(milliseconds: 210), duration: const Duration(milliseconds: 210),
opacity: isCurrentColor ? 1 : 0, opacity: isCurrentColor ? 1 : 0,
child: Icon(Icons.done, color: useWhiteForeground(color) ? Colors.white : Colors.black), child: Icon(Icons.done,
color: useWhiteForeground(color) ? Colors.white : Colors.black),
), ),
), ),
), ),
@ -124,9 +134,12 @@ class _BlockPickerState extends State<BlockPicker> {
widget.availableColors, widget.availableColors,
(Color color) => widget.itemBuilder( (Color color) => widget.itemBuilder(
color, color,
(_currentColor != null && (widget.useInShowDialog ? true : widget.pickerColor != null)) (_currentColor != null &&
(widget.useInShowDialog ? true : widget.pickerColor != null))
? (_currentColor?.value == color.value) && ? (_currentColor?.value == color.value) &&
(widget.useInShowDialog ? true : widget.pickerColor?.value == color.value) (widget.useInShowDialog
? true
: widget.pickerColor?.value == color.value)
: false, : false,
() => changeColor(color), () => changeColor(color),
), ),
@ -169,7 +182,9 @@ class _MultipleChoiceBlockPickerState extends State<MultipleChoiceBlockPicker> {
void toggleColor(Color color) { void toggleColor(Color color) {
setState(() { setState(() {
if (_currentColors != null) { if (_currentColors != null) {
_currentColors!.contains(color) ? _currentColors!.remove(color) : _currentColors!.add(color); _currentColors!.contains(color)
? _currentColors!.remove(color)
: _currentColors!.add(color);
} }
}); });
widget.onColorsChanged(_currentColors ?? []); widget.onColorsChanged(_currentColors ?? []);
@ -182,8 +197,12 @@ class _MultipleChoiceBlockPickerState extends State<MultipleChoiceBlockPicker> {
widget.availableColors, widget.availableColors,
(Color color) => widget.itemBuilder( (Color color) => widget.itemBuilder(
color, color,
(_currentColors != null && (widget.useInShowDialog ? true : widget.pickerColors != null)) (_currentColors != null &&
? _currentColors!.contains(color) && (widget.useInShowDialog ? true : widget.pickerColors!.contains(color)) (widget.useInShowDialog ? true : widget.pickerColors != null))
? _currentColors!.contains(color) &&
(widget.useInShowDialog
? true
: widget.pickerColors!.contains(color))
: false, : false,
() => toggleColor(color), () => toggleColor(color),
), ),

@ -20,9 +20,16 @@ class ColorPicker extends StatefulWidget {
this.onHsvColorChanged, this.onHsvColorChanged,
this.paletteType = PaletteType.hsvWithHue, this.paletteType = PaletteType.hsvWithHue,
this.enableAlpha = true, this.enableAlpha = true,
@Deprecated('Use empty list in [labelTypes] to disable label.') this.showLabel = true, @Deprecated('Use empty list in [labelTypes] to disable label.')
this.labelTypes = const [ColorLabelType.rgb, ColorLabelType.hsv, ColorLabelType.hsl], this.showLabel = true,
@Deprecated('Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.') this.labelTextStyle, this.labelTypes = const [
ColorLabelType.rgb,
ColorLabelType.hsv,
ColorLabelType.hsl
],
@Deprecated(
'Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.')
this.labelTextStyle,
this.displayThumbColor = false, this.displayThumbColor = false,
this.portraitOnly = false, this.portraitOnly = false,
this.colorPickerWidth = 300.0, this.colorPickerWidth = 300.0,
@ -168,8 +175,9 @@ class _ColorPickerState extends State<ColorPicker> {
@override @override
void initState() { void initState() {
currentHsvColor = currentHsvColor = (widget.pickerHsvColor != null)
(widget.pickerHsvColor != null) ? widget.pickerHsvColor as HSVColor : HSVColor.fromColor(widget.pickerColor); ? widget.pickerHsvColor as HSVColor
: HSVColor.fromColor(widget.pickerColor);
// If there's no initial text in `hexInputController`, // If there's no initial text in `hexInputController`,
if (widget.hexInputController?.text.isEmpty == true) { if (widget.hexInputController?.text.isEmpty == true) {
// set it to the current's color HEX value. // set it to the current's color HEX value.
@ -189,8 +197,9 @@ class _ColorPickerState extends State<ColorPicker> {
@override @override
void didUpdateWidget(ColorPicker oldWidget) { void didUpdateWidget(ColorPicker oldWidget) {
super.didUpdateWidget(oldWidget); super.didUpdateWidget(oldWidget);
currentHsvColor = currentHsvColor = (widget.pickerHsvColor != null)
(widget.pickerHsvColor != null) ? widget.pickerHsvColor as HSVColor : HSVColor.fromColor(widget.pickerColor); ? widget.pickerHsvColor as HSVColor
: HSVColor.fromColor(widget.pickerColor);
} }
void colorPickerTextInputListener() { void colorPickerTextInputListener() {
@ -199,14 +208,16 @@ class _ColorPickerState extends State<ColorPicker> {
if (widget.hexInputController == null) return; if (widget.hexInputController == null) return;
// If a user is inserting/typing any text try to get the color value from it, // If a user is inserting/typing any text try to get the color value from it,
// and interpret its transparency, dependent on the widget's settings. // and interpret its transparency, dependent on the widget's settings.
final Color? color = colorFromHex(widget.hexInputController!.text, enableAlpha: widget.enableAlpha); final Color? color = colorFromHex(widget.hexInputController!.text,
enableAlpha: widget.enableAlpha);
// If it's the valid color: // If it's the valid color:
if (color != null) { if (color != null) {
// set it as the current color and // set it as the current color and
setState(() => currentHsvColor = HSVColor.fromColor(color)); setState(() => currentHsvColor = HSVColor.fromColor(color));
// notify with a callback. // notify with a callback.
widget.onColorChanged(color); widget.onColorChanged(color);
if (widget.onHsvColorChanged != null) widget.onHsvColorChanged!(currentHsvColor); if (widget.onHsvColorChanged != null)
widget.onHsvColorChanged!(currentHsvColor);
} }
} }
@ -222,10 +233,12 @@ class _ColorPickerState extends State<ColorPicker> {
currentHsvColor, currentHsvColor,
(HSVColor color) { (HSVColor color) {
// Update text in `hexInputController` if provided. // Update text in `hexInputController` if provided.
widget.hexInputController?.text = colorToHex(color.toColor(), enableAlpha: widget.enableAlpha); widget.hexInputController?.text =
colorToHex(color.toColor(), enableAlpha: widget.enableAlpha);
setState(() => currentHsvColor = color); setState(() => currentHsvColor = color);
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
if (widget.onHsvColorChanged != null) widget.onHsvColorChanged!(currentHsvColor); if (widget.onHsvColorChanged != null)
widget.onHsvColorChanged!(currentHsvColor);
}, },
displayThumbColor: widget.displayThumbColor, displayThumbColor: widget.displayThumbColor,
); );
@ -233,18 +246,22 @@ class _ColorPickerState extends State<ColorPicker> {
void onColorChanging(HSVColor color) { void onColorChanging(HSVColor color) {
// Update text in `hexInputController` if provided. // Update text in `hexInputController` if provided.
widget.hexInputController?.text = colorToHex(color.toColor(), enableAlpha: widget.enableAlpha); widget.hexInputController?.text =
colorToHex(color.toColor(), enableAlpha: widget.enableAlpha);
setState(() => currentHsvColor = color); setState(() => currentHsvColor = color);
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
if (widget.onHsvColorChanged != null) widget.onHsvColorChanged!(currentHsvColor); if (widget.onHsvColorChanged != null)
widget.onHsvColorChanged!(currentHsvColor);
} }
Widget colorPicker() { Widget colorPicker() {
return ClipRRect( return ClipRRect(
borderRadius: widget.pickerAreaBorderRadius, borderRadius: widget.pickerAreaBorderRadius,
child: Padding( child: Padding(
padding: EdgeInsets.all(widget.paletteType == PaletteType.hueWheel ? 10 : 0), padding:
child: ColorPickerArea(currentHsvColor, onColorChanging, widget.paletteType), EdgeInsets.all(widget.paletteType == PaletteType.hueWheel ? 10 : 0),
child: ColorPickerArea(
currentHsvColor, onColorChanging, widget.paletteType),
), ),
); );
} }
@ -278,7 +295,8 @@ class _ColorPickerState extends State<ColorPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (MediaQuery.of(context).orientation == Orientation.portrait || widget.portraitOnly) { if (MediaQuery.of(context).orientation == Orientation.portrait ||
widget.portraitOnly) {
return Column( return Column(
children: <Widget>[ children: <Widget>[
SizedBox( SizedBox(
@ -293,7 +311,8 @@ class _ColorPickerState extends State<ColorPicker> {
children: <Widget>[ children: <Widget>[
GestureDetector( GestureDetector(
onTap: () => setState(() { onTap: () => setState(() {
if (widget.onHistoryChanged != null && !colorHistory.contains(currentHsvColor.toColor())) { if (widget.onHistoryChanged != null &&
!colorHistory.contains(currentHsvColor.toColor())) {
colorHistory.add(currentHsvColor.toColor()); colorHistory.add(currentHsvColor.toColor());
widget.onHistoryChanged!(colorHistory); widget.onHistoryChanged!(colorHistory);
} }
@ -303,7 +322,10 @@ class _ColorPickerState extends State<ColorPicker> {
Expanded( Expanded(
child: Column( child: Column(
children: <Widget>[ children: <Widget>[
SizedBox(height: 40.0, width: widget.colorPickerWidth - 75.0, child: sliderByPaletteType()), SizedBox(
height: 40.0,
width: widget.colorPickerWidth - 75.0,
child: sliderByPaletteType()),
if (widget.enableAlpha) if (widget.enableAlpha)
SizedBox( SizedBox(
height: 40.0, height: 40.0,
@ -320,7 +342,8 @@ class _ColorPickerState extends State<ColorPicker> {
SizedBox( SizedBox(
width: widget.colorPickerWidth, width: widget.colorPickerWidth,
height: 50, height: 50,
child: ListView(scrollDirection: Axis.horizontal, children: <Widget>[ child:
ListView(scrollDirection: Axis.horizontal, children: <Widget>[
for (Color color in colorHistory) for (Color color in colorHistory)
Padding( Padding(
key: Key(color.hashCode.toString()), key: Key(color.hashCode.toString()),
@ -328,7 +351,8 @@ class _ColorPickerState extends State<ColorPicker> {
child: Center( child: Center(
child: GestureDetector( child: GestureDetector(
onTap: () => onColorChanging(HSVColor.fromColor(color)), onTap: () => onColorChanging(HSVColor.fromColor(color)),
child: ColorIndicator(HSVColor.fromColor(color), width: 30, height: 30), child: ColorIndicator(HSVColor.fromColor(color),
width: 30, height: 30),
), ),
), ),
), ),
@ -350,7 +374,8 @@ class _ColorPickerState extends State<ColorPicker> {
(Color color) { (Color color) {
setState(() => currentHsvColor = HSVColor.fromColor(color)); setState(() => currentHsvColor = HSVColor.fromColor(color));
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
if (widget.onHsvColorChanged != null) widget.onHsvColorChanged!(currentHsvColor); if (widget.onHsvColorChanged != null)
widget.onHsvColorChanged!(currentHsvColor);
}, },
enableAlpha: widget.enableAlpha, enableAlpha: widget.enableAlpha,
embeddedText: false, embeddedText: false,
@ -372,7 +397,8 @@ class _ColorPickerState extends State<ColorPicker> {
const SizedBox(width: 20.0), const SizedBox(width: 20.0),
GestureDetector( GestureDetector(
onTap: () => setState(() { onTap: () => setState(() {
if (widget.onHistoryChanged != null && !colorHistory.contains(currentHsvColor.toColor())) { if (widget.onHistoryChanged != null &&
!colorHistory.contains(currentHsvColor.toColor())) {
colorHistory.add(currentHsvColor.toColor()); colorHistory.add(currentHsvColor.toColor());
widget.onHistoryChanged!(colorHistory); widget.onHistoryChanged!(colorHistory);
} }
@ -381,9 +407,15 @@ class _ColorPickerState extends State<ColorPicker> {
), ),
Column( Column(
children: <Widget>[ children: <Widget>[
SizedBox(height: 40.0, width: 260.0, child: sliderByPaletteType()), SizedBox(
height: 40.0,
width: 260.0,
child: sliderByPaletteType()),
if (widget.enableAlpha) if (widget.enableAlpha)
SizedBox(height: 40.0, width: 260.0, child: colorPickerSlider(TrackType.alpha)), SizedBox(
height: 40.0,
width: 260.0,
child: colorPickerSlider(TrackType.alpha)),
], ],
), ),
const SizedBox(width: 10.0), const SizedBox(width: 10.0),
@ -393,21 +425,25 @@ class _ColorPickerState extends State<ColorPicker> {
SizedBox( SizedBox(
width: widget.colorPickerWidth, width: widget.colorPickerWidth,
height: 50, height: 50,
child: ListView(scrollDirection: Axis.horizontal, children: <Widget>[ child: ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
for (Color color in colorHistory) for (Color color in colorHistory)
Padding( Padding(
key: Key(color.hashCode.toString()), key: Key(color.hashCode.toString()),
padding: const EdgeInsets.fromLTRB(15, 18, 0, 0), padding: const EdgeInsets.fromLTRB(15, 18, 0, 0),
child: Center( child: Center(
child: GestureDetector( child: GestureDetector(
onTap: () => onColorChanging(HSVColor.fromColor(color)), onTap: () =>
onColorChanging(HSVColor.fromColor(color)),
onLongPress: () { onLongPress: () {
if (colorHistory.remove(color)) { if (colorHistory.remove(color)) {
widget.onHistoryChanged!(colorHistory); widget.onHistoryChanged!(colorHistory);
setState(() {}); setState(() {});
} }
}, },
child: ColorIndicator(HSVColor.fromColor(color), width: 30, height: 30), child: ColorIndicator(HSVColor.fromColor(color),
width: 30, height: 30),
), ),
), ),
), ),
@ -430,7 +466,8 @@ class _ColorPickerState extends State<ColorPicker> {
(Color color) { (Color color) {
setState(() => currentHsvColor = HSVColor.fromColor(color)); setState(() => currentHsvColor = HSVColor.fromColor(color));
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
if (widget.onHsvColorChanged != null) widget.onHsvColorChanged!(currentHsvColor); if (widget.onHsvColorChanged != null)
widget.onHsvColorChanged!(currentHsvColor);
}, },
enableAlpha: widget.enableAlpha, enableAlpha: widget.enableAlpha,
embeddedText: false, embeddedText: false,
@ -454,11 +491,16 @@ class SlidePicker extends StatefulWidget {
this.enableAlpha = true, this.enableAlpha = true,
this.sliderSize = const Size(260, 40), this.sliderSize = const Size(260, 40),
this.showSliderText = true, this.showSliderText = true,
@Deprecated('Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.') this.sliderTextStyle, @Deprecated(
'Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.')
this.sliderTextStyle,
this.showParams = true, this.showParams = true,
@Deprecated('Use empty list in [labelTypes] to disable label.') this.showLabel = true, @Deprecated('Use empty list in [labelTypes] to disable label.')
this.showLabel = true,
this.labelTypes = const [], this.labelTypes = const [],
@Deprecated('Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.') this.labelTextStyle, @Deprecated(
'Use Theme.of(context).textTheme.bodyText1 & 2 to alter text style.')
this.labelTextStyle,
this.showIndicator = true, this.showIndicator = true,
this.indicatorSize = const Size(280, 50), this.indicatorSize = const Size(280, 50),
this.indicatorAlignmentBegin = const Alignment(-1.0, -3.0), this.indicatorAlignmentBegin = const Alignment(-1.0, -3.0),
@ -523,7 +565,8 @@ class _SlidePickerState extends State<SlidePicker> {
clipBehavior: Clip.antiAliasWithSaveLayer, clipBehavior: Clip.antiAliasWithSaveLayer,
child: GestureDetector( child: GestureDetector(
onTap: () { onTap: () {
setState(() => currentHsvColor = HSVColor.fromColor(widget.pickerColor)); setState(
() => currentHsvColor = HSVColor.fromColor(widget.pickerColor));
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
}, },
child: Container( child: Container(
@ -582,13 +625,26 @@ class _SlidePickerState extends State<SlidePicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
double fontSize = 14; double fontSize = 14;
if (widget.labelTextStyle != null && widget.labelTextStyle?.fontSize != null) { if (widget.labelTextStyle != null &&
widget.labelTextStyle?.fontSize != null) {
fontSize = widget.labelTextStyle?.fontSize ?? 14; fontSize = widget.labelTextStyle?.fontSize ?? 14;
} }
final List<TrackType> trackTypes = [ final List<TrackType> trackTypes = [
if (widget.colorModel == ColorModel.hsv) ...[TrackType.hue, TrackType.saturation, TrackType.value], if (widget.colorModel == ColorModel.hsv) ...[
if (widget.colorModel == ColorModel.hsl) ...[TrackType.hue, TrackType.saturationForHSL, TrackType.lightness], TrackType.hue,
if (widget.colorModel == ColorModel.rgb) ...[TrackType.red, TrackType.green, TrackType.blue], TrackType.saturation,
TrackType.value
],
if (widget.colorModel == ColorModel.hsl) ...[
TrackType.hue,
TrackType.saturationForHSL,
TrackType.lightness
],
if (widget.colorModel == ColorModel.rgb) ...[
TrackType.red,
TrackType.green,
TrackType.blue
],
if (widget.enableAlpha) ...[TrackType.alpha], if (widget.enableAlpha) ...[TrackType.alpha],
]; ];
List<SizedBox> sliders = [ List<SizedBox> sliders = [
@ -603,7 +659,8 @@ class _SlidePickerState extends State<SlidePicker> {
padding: const EdgeInsets.symmetric(horizontal: 10.0), padding: const EdgeInsets.symmetric(horizontal: 10.0),
child: Text( child: Text(
trackType.toString().split('.').last[0].toUpperCase(), trackType.toString().split('.').last[0].toUpperCase(),
style: widget.sliderTextStyle ?? Theme.of(context).textTheme.bodyLarge, style: widget.sliderTextStyle ??
Theme.of(context).textTheme.bodyLarge,
), ),
), ),
Expanded(child: colorPickerSlider(trackType)), Expanded(child: colorPickerSlider(trackType)),
@ -612,7 +669,8 @@ class _SlidePickerState extends State<SlidePicker> {
constraints: BoxConstraints(minWidth: fontSize * 2 + 5), constraints: BoxConstraints(minWidth: fontSize * 2 + 5),
child: Text( child: Text(
getColorParams(trackTypes.indexOf(trackType)), getColorParams(trackTypes.indexOf(trackType)),
style: widget.sliderTextStyle ?? Theme.of(context).textTheme.bodyMedium, style: widget.sliderTextStyle ??
Theme.of(context).textTheme.bodyMedium,
textAlign: TextAlign.right, textAlign: TextAlign.right,
), ),
), ),
@ -693,14 +751,17 @@ class _HueRingPickerState extends State<HueRingPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (MediaQuery.of(context).orientation == Orientation.portrait || widget.portraitOnly) { if (MediaQuery.of(context).orientation == Orientation.portrait ||
widget.portraitOnly) {
return Column( return Column(
children: <Widget>[ children: <Widget>[
ClipRRect( ClipRRect(
borderRadius: widget.pickerAreaBorderRadius, borderRadius: widget.pickerAreaBorderRadius,
child: Padding( child: Padding(
padding: const EdgeInsets.all(15), padding: const EdgeInsets.all(15),
child: Stack(alignment: AlignmentDirectional.center, children: <Widget>[ child: Stack(
alignment: AlignmentDirectional.center,
children: <Widget>[
SizedBox( SizedBox(
width: widget.colorPickerHeight, width: widget.colorPickerHeight,
height: widget.colorPickerHeight, height: widget.colorPickerHeight,
@ -714,7 +775,8 @@ class _HueRingPickerState extends State<HueRingPicker> {
SizedBox( SizedBox(
width: widget.colorPickerHeight / 1.6, width: widget.colorPickerHeight / 1.6,
height: widget.colorPickerHeight / 1.6, height: widget.colorPickerHeight / 1.6,
child: ColorPickerArea(currentHsvColor, onColorChanging, PaletteType.hsv), child: ColorPickerArea(
currentHsvColor, onColorChanging, PaletteType.hsv),
) )
]), ]),
), ),
@ -743,7 +805,8 @@ class _HueRingPickerState extends State<HueRingPicker> {
child: ColorPickerInput( child: ColorPickerInput(
currentHsvColor.toColor(), currentHsvColor.toColor(),
(Color color) { (Color color) {
setState(() => currentHsvColor = HSVColor.fromColor(color)); setState(
() => currentHsvColor = HSVColor.fromColor(color));
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
}, },
enableAlpha: widget.enableAlpha, enableAlpha: widget.enableAlpha,
@ -765,7 +828,8 @@ class _HueRingPickerState extends State<HueRingPicker> {
height: widget.colorPickerHeight, height: widget.colorPickerHeight,
child: ClipRRect( child: ClipRRect(
borderRadius: widget.pickerAreaBorderRadius, borderRadius: widget.pickerAreaBorderRadius,
child: ColorPickerArea(currentHsvColor, onColorChanging, PaletteType.hsv), child: ColorPickerArea(
currentHsvColor, onColorChanging, PaletteType.hsv),
), ),
), ),
), ),
@ -773,11 +837,17 @@ class _HueRingPickerState extends State<HueRingPicker> {
borderRadius: widget.pickerAreaBorderRadius, borderRadius: widget.pickerAreaBorderRadius,
child: Padding( child: Padding(
padding: const EdgeInsets.all(15), padding: const EdgeInsets.all(15),
child: Stack(alignment: AlignmentDirectional.topCenter, children: <Widget>[ child: Stack(
alignment: AlignmentDirectional.topCenter,
children: <Widget>[
SizedBox( SizedBox(
width: widget.colorPickerHeight - widget.hueRingStrokeWidth * 2, width: widget.colorPickerHeight -
height: widget.colorPickerHeight - widget.hueRingStrokeWidth * 2, widget.hueRingStrokeWidth * 2,
child: ColorPickerHueRing(currentHsvColor, onColorChanging, strokeWidth: widget.hueRingStrokeWidth), height: widget.colorPickerHeight -
widget.hueRingStrokeWidth * 2,
child: ColorPickerHueRing(
currentHsvColor, onColorChanging,
strokeWidth: widget.hueRingStrokeWidth),
), ),
Column( Column(
children: [ children: [
@ -787,7 +857,8 @@ class _HueRingPickerState extends State<HueRingPicker> {
ColorPickerInput( ColorPickerInput(
currentHsvColor.toColor(), currentHsvColor.toColor(),
(Color color) { (Color color) {
setState(() => currentHsvColor = HSVColor.fromColor(color)); setState(() =>
currentHsvColor = HSVColor.fromColor(color));
widget.onColorChanged(currentHsvColor.toColor()); widget.onColorChanged(currentHsvColor.toColor());
}, },
enableAlpha: widget.enableAlpha, enableAlpha: widget.enableAlpha,
@ -798,7 +869,9 @@ class _HueRingPickerState extends State<HueRingPicker> {
if (widget.enableAlpha) if (widget.enableAlpha)
SizedBox( SizedBox(
height: 40.0, height: 40.0,
width: (widget.colorPickerHeight - widget.hueRingStrokeWidth * 2) / 2, width: (widget.colorPickerHeight -
widget.hueRingStrokeWidth * 2) /
2,
child: ColorPickerSlider( child: ColorPickerSlider(
TrackType.alpha, TrackType.alpha,
currentHsvColor, currentHsvColor,

@ -164,7 +164,8 @@ const Map<String, Color> x11Colors = {
'yellowgreen': Color(0xff9acd32), 'yellowgreen': Color(0xff9acd32),
}; };
Color? colorFromName(String val) => x11Colors[val.trim().replaceAll(' ', '').toLowerCase()]; Color? colorFromName(String val) =>
x11Colors[val.trim().replaceAll(' ', '').toLowerCase()];
extension ColorExtension on String { extension ColorExtension on String {
Color? toColor() => colorFromName(this); Color? toColor() => colorFromName(this);

@ -61,16 +61,29 @@ class _MaterialPickerState extends State<MaterialPicker> {
for (Color colorType in colors) { for (Color colorType in colors) {
if (colorType == Colors.grey) { if (colorType == Colors.grey) {
result.addAll([50, 100, 200, 300, 350, 400, 500, 600, 700, 800, 850, 900] result.addAll([
.map((int shade) => {Colors.grey[shade]!: shade.toString()}) 50,
.toList()); 100,
200,
300,
350,
400,
500,
600,
700,
800,
850,
900
].map((int shade) => {Colors.grey[shade]!: shade.toString()}).toList());
} else if (colorType == Colors.black || colorType == Colors.white) { } else if (colorType == Colors.black || colorType == Colors.white) {
result.addAll([ result.addAll([
{Colors.black: ''}, {Colors.black: ''},
{Colors.white: ''} {Colors.white: ''}
]); ]);
} else if (colorType is MaterialAccentColor) { } else if (colorType is MaterialAccentColor) {
result.addAll([100, 200, 400, 700].map((int shade) => {colorType[shade]!: 'A$shade'}).toList()); result.addAll([100, 200, 400, 700]
.map((int shade) => {colorType[shade]!: 'A$shade'})
.toList());
} else if (colorType is MaterialColor) { } else if (colorType is MaterialColor) {
result.addAll([50, 100, 200, 300, 400, 500, 600, 700, 800, 900] result.addAll([50, 100, 200, 300, 400, 500, 600, 700, 800, 900]
.map((int shade) => {colorType[shade]!: shade.toString()}) .map((int shade) => {colorType[shade]!: shade.toString()})
@ -100,25 +113,50 @@ class _MaterialPickerState extends State<MaterialPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
bool _isPortrait = MediaQuery.of(context).orientation == Orientation.portrait || widget.portraitOnly; bool _isPortrait =
MediaQuery.of(context).orientation == Orientation.portrait ||
widget.portraitOnly;
Widget _colorList() { Widget _colorList() {
return Container( return Container(
clipBehavior: Clip.hardEdge, clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(), decoration: const BoxDecoration(),
child: Container( child: Container(
margin: _isPortrait ? const EdgeInsets.only(right: 10) : const EdgeInsets.only(bottom: 10), margin: _isPortrait
? const EdgeInsets.only(right: 10)
: const EdgeInsets.only(bottom: 10),
width: _isPortrait ? 60 : null, width: _isPortrait ? 60 : null,
height: _isPortrait ? null : 60, height: _isPortrait ? null : 60,
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context).cardColor, color: Theme.of(context).cardColor,
boxShadow: [BoxShadow(color: (Theme.of(context).brightness == Brightness.light) ? (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38 : Colors.black38, blurRadius: 10)], boxShadow: [
BoxShadow(
color: (Theme.of(context).brightness == Brightness.light)
? (Theme.of(context).brightness == Brightness.light)
? Colors.grey[300]!
: Colors.black38
: Colors.black38,
blurRadius: 10)
],
border: _isPortrait border: _isPortrait
? Border(right: BorderSide(color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, width: 1)) ? Border(
: Border(top: BorderSide(color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, width: 1)), right: BorderSide(
color:
(Theme.of(context).brightness == Brightness.light)
? Colors.grey[300]!
: Colors.black38,
width: 1))
: Border(
top: BorderSide(
color:
(Theme.of(context).brightness == Brightness.light)
? Colors.grey[300]!
: Colors.black38,
width: 1)),
), ),
child: ScrollConfiguration( child: ScrollConfiguration(
behavior: ScrollConfiguration.of(context).copyWith(dragDevices: PointerDeviceKind.values.toSet()), behavior: ScrollConfiguration.of(context)
.copyWith(dragDevices: PointerDeviceKind.values.toSet()),
child: ListView( child: ListView(
scrollDirection: _isPortrait ? Axis.vertical : Axis.horizontal, scrollDirection: _isPortrait ? Axis.vertical : Axis.horizontal,
children: [ children: [
@ -129,13 +167,15 @@ class _MaterialPickerState extends State<MaterialPicker> {
Color _colorType = _colors[0]; Color _colorType = _colors[0];
return GestureDetector( return GestureDetector(
onTap: () { onTap: () {
if (widget.onPrimaryChanged != null) widget.onPrimaryChanged!(_colorType); if (widget.onPrimaryChanged != null)
widget.onPrimaryChanged!(_colorType);
setState(() => _currentColorType = _colors); setState(() => _currentColorType = _colors);
}, },
child: Container( child: Container(
color: const Color(0x00000000), color: const Color(0x00000000),
padding: padding: _isPortrait
_isPortrait ? const EdgeInsets.fromLTRB(0, 7, 0, 7) : const EdgeInsets.fromLTRB(7, 0, 7, 0), ? const EdgeInsets.fromLTRB(0, 7, 0, 7)
: const EdgeInsets.fromLTRB(7, 0, 7, 0),
child: Align( child: Align(
child: AnimatedContainer( child: AnimatedContainer(
duration: const Duration(milliseconds: 300), duration: const Duration(milliseconds: 300),
@ -148,7 +188,11 @@ class _MaterialPickerState extends State<MaterialPicker> {
? [ ? [
_colorType == Theme.of(context).cardColor _colorType == Theme.of(context).cardColor
? BoxShadow( ? BoxShadow(
color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, color:
(Theme.of(context).brightness ==
Brightness.light)
? Colors.grey[300]!
: Colors.black38,
blurRadius: 10, blurRadius: 10,
) )
: BoxShadow( : BoxShadow(
@ -158,7 +202,12 @@ class _MaterialPickerState extends State<MaterialPicker> {
] ]
: null, : null,
border: _colorType == Theme.of(context).cardColor border: _colorType == Theme.of(context).cardColor
? Border.all(color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, width: 1) ? Border.all(
color: (Theme.of(context).brightness ==
Brightness.light)
? Colors.grey[300]!
: Colors.black38,
width: 1)
: null, : null,
), ),
), ),
@ -178,7 +227,8 @@ class _MaterialPickerState extends State<MaterialPicker> {
Widget _shadingList() { Widget _shadingList() {
return ScrollConfiguration( return ScrollConfiguration(
behavior: ScrollConfiguration.of(context).copyWith(dragDevices: PointerDeviceKind.values.toSet()), behavior: ScrollConfiguration.of(context)
.copyWith(dragDevices: PointerDeviceKind.values.toSet()),
child: ListView( child: ListView(
scrollDirection: _isPortrait ? Axis.vertical : Axis.horizontal, scrollDirection: _isPortrait ? Axis.vertical : Axis.horizontal,
children: [ children: [
@ -194,22 +244,31 @@ class _MaterialPickerState extends State<MaterialPicker> {
}, },
child: Container( child: Container(
color: const Color(0x00000000), color: const Color(0x00000000),
margin: _isPortrait ? const EdgeInsets.only(right: 10) : const EdgeInsets.only(bottom: 10), margin: _isPortrait
padding: _isPortrait ? const EdgeInsets.fromLTRB(0, 7, 0, 7) : const EdgeInsets.fromLTRB(7, 0, 7, 0), ? const EdgeInsets.only(right: 10)
: const EdgeInsets.only(bottom: 10),
padding: _isPortrait
? const EdgeInsets.fromLTRB(0, 7, 0, 7)
: const EdgeInsets.fromLTRB(7, 0, 7, 0),
child: Align( child: Align(
child: AnimatedContainer( child: AnimatedContainer(
curve: Curves.fastOutSlowIn, curve: Curves.fastOutSlowIn,
duration: const Duration(milliseconds: 500), duration: const Duration(milliseconds: 500),
width: width: _isPortrait
_isPortrait ? (_currentShading == _color ? 250 : 230) : (_currentShading == _color ? 50 : 30), ? (_currentShading == _color ? 250 : 230)
: (_currentShading == _color ? 50 : 30),
height: _isPortrait ? 50 : 220, height: _isPortrait ? 50 : 220,
decoration: BoxDecoration( decoration: BoxDecoration(
color: _color, color: _color,
boxShadow: _currentShading == _color boxShadow: _currentShading == _color
? [ ? [
(_color == Colors.white) || (_color == Colors.black) (_color == Colors.white) ||
(_color == Colors.black)
? BoxShadow( ? BoxShadow(
color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, color: (Theme.of(context).brightness ==
Brightness.light)
? Colors.grey[300]!
: Colors.black38,
blurRadius: 10, blurRadius: 10,
) )
: BoxShadow( : BoxShadow(
@ -218,8 +277,14 @@ class _MaterialPickerState extends State<MaterialPicker> {
), ),
] ]
: null, : null,
border: (_color == Colors.white) || (_color == Colors.black) border:
? Border.all(color: (Theme.of(context).brightness == Brightness.light) ? Colors.grey[300]! : Colors.black38, width: 1) (_color == Colors.white) || (_color == Colors.black)
? Border.all(
color: (Theme.of(context).brightness ==
Brightness.light)
? Colors.grey[300]!
: Colors.black38,
width: 1)
: null, : null,
), ),
child: widget.enableLabel child: widget.enableLabel
@ -228,7 +293,10 @@ class _MaterialPickerState extends State<MaterialPicker> {
children: [ children: [
Text( Text(
' ${color.values.first}', ' ${color.values.first}',
style: TextStyle(color: useWhiteForeground(_color) ? Colors.white : Colors.black), style: TextStyle(
color: useWhiteForeground(_color)
? Colors.white
: Colors.black),
), ),
Expanded( Expanded(
child: Align( child: Align(
@ -236,7 +304,9 @@ class _MaterialPickerState extends State<MaterialPicker> {
child: Text( child: Text(
'#${(_color.toString().replaceFirst('Color(0xff', '').replaceFirst(')', '')).toUpperCase()} ', '#${(_color.toString().replaceFirst('Color(0xff', '').replaceFirst(')', '')).toUpperCase()} ',
style: TextStyle( style: TextStyle(
color: useWhiteForeground(_color) ? Colors.white : Colors.black, color: useWhiteForeground(_color)
? Colors.white
: Colors.black,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
), ),
@ -253,7 +323,9 @@ class _MaterialPickerState extends State<MaterialPicker> {
child: Text( child: Text(
color.values.first, color.values.first,
style: TextStyle( style: TextStyle(
color: useWhiteForeground(_color) ? Colors.white : Colors.black, color: useWhiteForeground(_color)
? Colors.white
: Colors.black,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 14, fontSize: 14,
), ),

@ -76,10 +76,14 @@ class HSVWithHueColorPainter extends CustomPainter {
); );
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * hsvColor.saturation, size.height * (1 - hsvColor.value)), Offset(
size.width * hsvColor.saturation, size.height * (1 - hsvColor.value)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hsvColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hsvColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..blendMode = BlendMode.luminosity ..blendMode = BlendMode.luminosity
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
@ -125,7 +129,10 @@ class HSVWithSaturationColorPainter extends CustomPainter {
), ),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hsvColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hsvColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -174,7 +181,10 @@ class HSVWithValueColorPainter extends CustomPainter {
), ),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hsvColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hsvColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -215,10 +225,14 @@ class HSLWithHueColorPainter extends CustomPainter {
canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect)); canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect));
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * hslColor.saturation, size.height * (1 - hslColor.lightness)), Offset(size.width * hslColor.saturation,
size.height * (1 - hslColor.lightness)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hslColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hslColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -263,10 +277,14 @@ class HSLWithSaturationColorPainter extends CustomPainter {
canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect)); canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect));
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * hslColor.hue / 360, size.height * (1 - hslColor.lightness)), Offset(size.width * hslColor.hue / 360,
size.height * (1 - hslColor.lightness)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hslColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hslColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -308,18 +326,26 @@ class HSLWithLightnessColorPainter extends CustomPainter {
canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect)); canvas.drawRect(rect, Paint()..shader = gradientV.createShader(rect));
canvas.drawRect( canvas.drawRect(
rect, rect,
Paint()..color = Colors.black.withOpacity((1 - hslColor.lightness * 2).clamp(0, 1)), Paint()
..color =
Colors.black.withOpacity((1 - hslColor.lightness * 2).clamp(0, 1)),
); );
canvas.drawRect( canvas.drawRect(
rect, rect,
Paint()..color = Colors.white.withOpacity(((hslColor.lightness - 0.5) * 2).clamp(0, 1)), Paint()
..color = Colors.white
.withOpacity(((hslColor.lightness - 0.5) * 2).clamp(0, 1)),
); );
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * hslColor.hue / 360, size.height * (1 - hslColor.saturation)), Offset(size.width * hslColor.hue / 360,
size.height * (1 - hslColor.saturation)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hslColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hslColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -362,10 +388,12 @@ class RGBWithRedColorPainter extends CustomPainter {
); );
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * color.blue / 255, size.height * (1 - color.green / 255)), Offset(
size.width * color.blue / 255, size.height * (1 - color.green / 255)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(color) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(color) ? Colors.white : Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -408,10 +436,12 @@ class RGBWithGreenColorPainter extends CustomPainter {
); );
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * color.blue / 255, size.height * (1 - color.red / 255)), Offset(
size.width * color.blue / 255, size.height * (1 - color.red / 255)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(color) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(color) ? Colors.white : Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -454,10 +484,12 @@ class RGBWithBlueColorPainter extends CustomPainter {
); );
canvas.drawCircle( canvas.drawCircle(
Offset(size.width * color.red / 255, size.height * (1 - color.green / 255)), Offset(
size.width * color.red / 255, size.height * (1 - color.green / 255)),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(color) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(color) ? Colors.white : Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -496,18 +528,26 @@ class HUEColorWheelPainter extends CustomPainter {
Color(0x00FFFFFF), Color(0x00FFFFFF),
], ],
); );
canvas.drawCircle(center, radio, Paint()..shader = gradientS.createShader(rect)); canvas.drawCircle(
canvas.drawCircle(center, radio, Paint()..shader = gradientR.createShader(rect)); center, radio, Paint()..shader = gradientS.createShader(rect));
canvas.drawCircle(center, radio, Paint()..color = Colors.black.withOpacity(1 - hsvColor.value)); canvas.drawCircle(
center, radio, Paint()..shader = gradientR.createShader(rect));
canvas.drawCircle(center, radio,
Paint()..color = Colors.black.withOpacity(1 - hsvColor.value));
canvas.drawCircle( canvas.drawCircle(
Offset( Offset(
center.dx + hsvColor.saturation * radio * cos((hsvColor.hue * pi / 180)), center.dx +
center.dy - hsvColor.saturation * radio * sin((hsvColor.hue * pi / 180)), hsvColor.saturation * radio * cos((hsvColor.hue * pi / 180)),
center.dy -
hsvColor.saturation * radio * sin((hsvColor.hue * pi / 180)),
), ),
size.height * 0.04, size.height * 0.04,
Paint() Paint()
..color = pointerColor ?? (useWhiteForeground(hsvColor.toColor()) ? Colors.white : Colors.black) ..color = pointerColor ??
(useWhiteForeground(hsvColor.toColor())
? Colors.white
: Colors.black)
..strokeWidth = 1.5 ..strokeWidth = 1.5
..style = PaintingStyle.stroke, ..style = PaintingStyle.stroke,
); );
@ -519,7 +559,8 @@ class HUEColorWheelPainter extends CustomPainter {
/// Painter for hue ring. /// Painter for hue ring.
class HueRingPainter extends CustomPainter { class HueRingPainter extends CustomPainter {
const HueRingPainter(this.hsvColor, {this.displayThumbColor = true, this.strokeWidth = 5}); const HueRingPainter(this.hsvColor,
{this.displayThumbColor = true, this.strokeWidth = 5});
final HSVColor hsvColor; final HSVColor hsvColor;
final bool displayThumbColor; final bool displayThumbColor;
@ -553,7 +594,11 @@ class HueRingPainter extends CustomPainter {
center.dx + radio * cos((hsvColor.hue * pi / 180)), center.dx + radio * cos((hsvColor.hue * pi / 180)),
center.dy - radio * sin((hsvColor.hue * pi / 180)), center.dy - radio * sin((hsvColor.hue * pi / 180)),
); );
canvas.drawShadow(Path()..addOval(Rect.fromCircle(center: offset, radius: 12)), Colors.black, 3.0, true); canvas.drawShadow(
Path()..addOval(Rect.fromCircle(center: offset, radius: 12)),
Colors.black,
3.0,
true);
canvas.drawCircle( canvas.drawCircle(
offset, offset,
size.height * 0.04, size.height * 0.04,
@ -729,7 +774,8 @@ class ThumbPainter extends CustomPainter {
canvas.drawShadow( canvas.drawShadow(
Path() Path()
..addOval( ..addOval(
Rect.fromCircle(center: const Offset(0.5, 2.0), radius: size.width * 1.8), Rect.fromCircle(
center: const Offset(0.5, 2.0), radius: size.width * 1.8),
), ),
Colors.black, Colors.black,
3.0, 3.0,
@ -816,7 +862,11 @@ class ColorPickerLabel extends StatefulWidget {
this.hsvColor, { this.hsvColor, {
Key? key, Key? key,
this.enableAlpha = true, this.enableAlpha = true,
this.colorLabelTypes = const [ColorLabelType.rgb, ColorLabelType.hsv, ColorLabelType.hsl], this.colorLabelTypes = const [
ColorLabelType.rgb,
ColorLabelType.hsv,
ColorLabelType.hsl
],
this.textStyle, this.textStyle,
}) : assert(colorLabelTypes.length > 0), }) : assert(colorLabelTypes.length > 0),
super(key: key); super(key: key);
@ -885,7 +935,8 @@ class _ColorPickerLabelState extends State<ColorPickerLabel> {
List<Widget> colorValueLabels() { List<Widget> colorValueLabels() {
double fontSize = 14; double fontSize = 14;
if (widget.textStyle != null && widget.textStyle?.fontSize != null) fontSize = widget.textStyle?.fontSize ?? 14; if (widget.textStyle != null && widget.textStyle?.fontSize != null)
fontSize = widget.textStyle?.fontSize ?? 14;
return [ return [
for (String item in _colorTypes[_colorType] ?? []) for (String item in _colorTypes[_colorType] ?? [])
@ -899,14 +950,17 @@ class _ColorPickerLabelState extends State<ColorPickerLabel> {
children: <Widget>[ children: <Widget>[
Text( Text(
item, item,
style: widget.textStyle ?? Theme.of(context).textTheme.bodyLarge, style: widget.textStyle ??
Theme.of(context).textTheme.bodyLarge,
), ),
const SizedBox(height: 10.0), const SizedBox(height: 10.0),
Expanded( Expanded(
child: Text( child: Text(
colorValue(widget.hsvColor, _colorType)[_colorTypes[_colorType]!.indexOf(item)], colorValue(widget.hsvColor, _colorType)[
_colorTypes[_colorType]!.indexOf(item)],
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: widget.textStyle ?? Theme.of(context).textTheme.bodyMedium, style: widget.textStyle ??
Theme.of(context).textTheme.bodyMedium,
), ),
), ),
], ],
@ -977,12 +1031,18 @@ class _ColorPickerInputState extends State<ColorPickerInput> {
widget.color.red.toRadixString(16).toUpperCase().padLeft(2, '0') + widget.color.red.toRadixString(16).toUpperCase().padLeft(2, '0') +
widget.color.green.toRadixString(16).toUpperCase().padLeft(2, '0') + widget.color.green.toRadixString(16).toUpperCase().padLeft(2, '0') +
widget.color.blue.toRadixString(16).toUpperCase().padLeft(2, '0') + widget.color.blue.toRadixString(16).toUpperCase().padLeft(2, '0') +
(widget.enableAlpha ? widget.color.alpha.toRadixString(16).toUpperCase().padLeft(2, '0') : ''); (widget.enableAlpha
? widget.color.alpha
.toRadixString(16)
.toUpperCase()
.padLeft(2, '0')
: '');
} }
return Padding( return Padding(
padding: const EdgeInsets.only(top: 5.0), padding: const EdgeInsets.only(top: 5.0),
child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [ child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
if (!widget.embeddedText) Text('Hex', style: Theme.of(context).textTheme.bodyLarge), if (!widget.embeddedText)
Text('Hex', style: Theme.of(context).textTheme.bodyLarge),
const SizedBox(width: 10), const SizedBox(width: 10),
SizedBox( SizedBox(
width: (Theme.of(context).textTheme.bodyMedium?.fontSize ?? 14) * 10, width: (Theme.of(context).textTheme.bodyMedium?.fontSize ?? 14) * 10,
@ -1001,7 +1061,8 @@ class _ColorPickerInputState extends State<ColorPickerInput> {
onChanged: (String value) { onChanged: (String value) {
String input = value; String input = value;
if (value.length == 9) { if (value.length == 9) {
input = value.split('').getRange(7, 9).join() + value.split('').getRange(1, 7).join(); input = value.split('').getRange(7, 9).join() +
value.split('').getRange(1, 7).join();
} }
final Color? color = colorFromHex(input); final Color? color = colorFromHex(input);
if (color != null) { if (color != null) {
@ -1035,7 +1096,8 @@ class ColorPickerSlider extends StatelessWidget {
void slideEvent(RenderBox getBox, BoxConstraints box, Offset globalPosition) { void slideEvent(RenderBox getBox, BoxConstraints box, Offset globalPosition) {
double localDx = getBox.globalToLocal(globalPosition).dx - 15.0; double localDx = getBox.globalToLocal(globalPosition).dx - 15.0;
double progress = localDx.clamp(0.0, box.maxWidth - 30.0) / (box.maxWidth - 30.0); double progress =
localDx.clamp(0.0, box.maxWidth - 30.0) / (box.maxWidth - 30.0);
switch (trackType) { switch (trackType) {
case TrackType.hue: case TrackType.hue:
// 360 is the same as zero // 360 is the same as zero
@ -1055,16 +1117,20 @@ class ColorPickerSlider extends StatelessWidget {
onColorChanged(hslToHsv(hsvToHsl(hsvColor).withLightness(progress))); onColorChanged(hslToHsv(hsvToHsl(hsvColor).withLightness(progress)));
break; break;
case TrackType.red: case TrackType.red:
onColorChanged(HSVColor.fromColor(hsvColor.toColor().withRed((progress * 0xff).round()))); onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withRed((progress * 0xff).round())));
break; break;
case TrackType.green: case TrackType.green:
onColorChanged(HSVColor.fromColor(hsvColor.toColor().withGreen((progress * 0xff).round()))); onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withGreen((progress * 0xff).round())));
break; break;
case TrackType.blue: case TrackType.blue:
onColorChanged(HSVColor.fromColor(hsvColor.toColor().withBlue((progress * 0xff).round()))); onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withBlue((progress * 0xff).round())));
break; break;
case TrackType.alpha: case TrackType.alpha:
onColorChanged(hsvColor.withAlpha(localDx.clamp(0.0, box.maxWidth - 30.0) / (box.maxWidth - 30.0))); onColorChanged(hsvColor.withAlpha(
localDx.clamp(0.0, box.maxWidth - 30.0) / (box.maxWidth - 30.0)));
break; break;
} }
} }
@ -1081,26 +1147,34 @@ class ColorPickerSlider extends StatelessWidget {
break; break;
case TrackType.saturation: case TrackType.saturation:
thumbOffset += (box.maxWidth - 30.0) * hsvColor.saturation; thumbOffset += (box.maxWidth - 30.0) * hsvColor.saturation;
thumbColor = HSVColor.fromAHSV(1.0, hsvColor.hue, hsvColor.saturation, 1.0).toColor(); thumbColor =
HSVColor.fromAHSV(1.0, hsvColor.hue, hsvColor.saturation, 1.0)
.toColor();
break; break;
case TrackType.saturationForHSL: case TrackType.saturationForHSL:
thumbOffset += (box.maxWidth - 30.0) * hsvToHsl(hsvColor).saturation; thumbOffset += (box.maxWidth - 30.0) * hsvToHsl(hsvColor).saturation;
thumbColor = HSLColor.fromAHSL(1.0, hsvColor.hue, hsvToHsl(hsvColor).saturation, 0.5).toColor(); thumbColor = HSLColor.fromAHSL(
1.0, hsvColor.hue, hsvToHsl(hsvColor).saturation, 0.5)
.toColor();
break; break;
case TrackType.value: case TrackType.value:
thumbOffset += (box.maxWidth - 30.0) * hsvColor.value; thumbOffset += (box.maxWidth - 30.0) * hsvColor.value;
thumbColor = HSVColor.fromAHSV(1.0, hsvColor.hue, 1.0, hsvColor.value).toColor(); thumbColor = HSVColor.fromAHSV(1.0, hsvColor.hue, 1.0, hsvColor.value)
.toColor();
break; break;
case TrackType.lightness: case TrackType.lightness:
thumbOffset += (box.maxWidth - 30.0) * hsvToHsl(hsvColor).lightness; thumbOffset += (box.maxWidth - 30.0) * hsvToHsl(hsvColor).lightness;
thumbColor = HSLColor.fromAHSL(1.0, hsvColor.hue, 1.0, hsvToHsl(hsvColor).lightness).toColor(); thumbColor = HSLColor.fromAHSL(
1.0, hsvColor.hue, 1.0, hsvToHsl(hsvColor).lightness)
.toColor();
break; break;
case TrackType.red: case TrackType.red:
thumbOffset += (box.maxWidth - 30.0) * hsvColor.toColor().red / 0xff; thumbOffset += (box.maxWidth - 30.0) * hsvColor.toColor().red / 0xff;
thumbColor = hsvColor.toColor().withOpacity(1.0); thumbColor = hsvColor.toColor().withOpacity(1.0);
break; break;
case TrackType.green: case TrackType.green:
thumbOffset += (box.maxWidth - 30.0) * hsvColor.toColor().green / 0xff; thumbOffset +=
(box.maxWidth - 30.0) * hsvColor.toColor().green / 0xff;
thumbColor = hsvColor.toColor().withOpacity(1.0); thumbColor = hsvColor.toColor().withOpacity(1.0);
break; break;
case TrackType.blue: case TrackType.blue:
@ -1145,10 +1219,12 @@ class ColorPickerSlider extends StatelessWidget {
builder: (BuildContext context, BoxConstraints box) { builder: (BuildContext context, BoxConstraints box) {
RenderBox? getBox = context.findRenderObject() as RenderBox?; RenderBox? getBox = context.findRenderObject() as RenderBox?;
return GestureDetector( return GestureDetector(
onPanDown: (DragDownDetails details) => onPanDown: (DragDownDetails details) => getBox != null
getBox != null ? slideEvent(getBox, box, details.globalPosition) : null, ? slideEvent(getBox, box, details.globalPosition)
onPanUpdate: (DragUpdateDetails details) => : null,
getBox != null ? slideEvent(getBox, box, details.globalPosition) : null, onPanUpdate: (DragUpdateDetails details) => getBox != null
? slideEvent(getBox, box, details.globalPosition)
: null,
); );
}, },
), ),
@ -1212,7 +1288,8 @@ class ColorPickerArea extends StatelessWidget {
onColorChanged(hsvColor.withHue(horizontal * 360).withValue(vertical)); onColorChanged(hsvColor.withHue(horizontal * 360).withValue(vertical));
break; break;
case PaletteType.hsvWithValue: case PaletteType.hsvWithValue:
onColorChanged(hsvColor.withHue(horizontal * 360).withSaturation(vertical)); onColorChanged(
hsvColor.withHue(horizontal * 360).withSaturation(vertical));
break; break;
case PaletteType.hsl: case PaletteType.hsl:
case PaletteType.hslWithHue: case PaletteType.hslWithHue:
@ -1232,17 +1309,26 @@ class ColorPickerArea extends StatelessWidget {
break; break;
case PaletteType.rgbWithRed: case PaletteType.rgbWithRed:
onColorChanged(HSVColor.fromColor( onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withBlue((horizontal * 255).round()).withGreen((vertical * 255).round()), hsvColor
.toColor()
.withBlue((horizontal * 255).round())
.withGreen((vertical * 255).round()),
)); ));
break; break;
case PaletteType.rgbWithGreen: case PaletteType.rgbWithGreen:
onColorChanged(HSVColor.fromColor( onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withBlue((horizontal * 255).round()).withRed((vertical * 255).round()), hsvColor
.toColor()
.withBlue((horizontal * 255).round())
.withRed((vertical * 255).round()),
)); ));
break; break;
case PaletteType.rgbWithBlue: case PaletteType.rgbWithBlue:
onColorChanged(HSVColor.fromColor( onColorChanged(HSVColor.fromColor(
hsvColor.toColor().withRed((horizontal * 255).round()).withGreen((vertical * 255).round()), hsvColor
.toColor()
.withRed((horizontal * 255).round())
.withGreen((vertical * 255).round()),
)); ));
break; break;
default: default:
@ -1254,7 +1340,8 @@ class ColorPickerArea extends StatelessWidget {
onColorChanged(hsvColor.withHue(hue).withSaturation(radio)); onColorChanged(hsvColor.withHue(hue).withSaturation(radio));
} }
void _handleGesture(Offset position, BuildContext context, double height, double width) { void _handleGesture(
Offset position, BuildContext context, double height, double width) {
RenderBox? getBox = context.findRenderObject() as RenderBox?; RenderBox? getBox = context.findRenderObject() as RenderBox?;
if (getBox == null) return; if (getBox == null) return;
@ -1265,9 +1352,15 @@ class ColorPickerArea extends StatelessWidget {
if (paletteType == PaletteType.hueWheel) { if (paletteType == PaletteType.hueWheel) {
Offset center = Offset(width / 2, height / 2); Offset center = Offset(width / 2, height / 2);
double radio = width <= height ? width / 2 : height / 2; double radio = width <= height ? width / 2 : height / 2;
double dist = sqrt(pow(horizontal - center.dx, 2) + pow(vertical - center.dy, 2)) / radio; double dist =
double rad = (atan2(horizontal - center.dx, vertical - center.dy) / pi + 1) / 2 * 360; sqrt(pow(horizontal - center.dx, 2) + pow(vertical - center.dy, 2)) /
_handleColorWheelChange(((rad + 90) % 360).clamp(0, 360), dist.clamp(0, 1)); radio;
double rad =
(atan2(horizontal - center.dx, vertical - center.dy) / pi + 1) /
2 *
360;
_handleColorWheelChange(
((rad + 90) % 360).clamp(0, 360), dist.clamp(0, 1));
} else { } else {
_handleColorRectChange(horizontal / width, 1 - vertical / height); _handleColorRectChange(horizontal / width, 1 - vertical / height);
} }
@ -1282,12 +1375,16 @@ class ColorPickerArea extends StatelessWidget {
return RawGestureDetector( return RawGestureDetector(
gestures: { gestures: {
_AlwaysWinPanGestureRecognizer: GestureRecognizerFactoryWithHandlers<_AlwaysWinPanGestureRecognizer>( _AlwaysWinPanGestureRecognizer:
GestureRecognizerFactoryWithHandlers<
_AlwaysWinPanGestureRecognizer>(
() => _AlwaysWinPanGestureRecognizer(), () => _AlwaysWinPanGestureRecognizer(),
(_AlwaysWinPanGestureRecognizer instance) { (_AlwaysWinPanGestureRecognizer instance) {
instance instance
..onDown = ((details) => _handleGesture(details.globalPosition, context, height, width)) ..onDown = ((details) => _handleGesture(
..onUpdate = ((details) => _handleGesture(details.globalPosition, context, height, width)); details.globalPosition, context, height, width))
..onUpdate = ((details) => _handleGesture(
details.globalPosition, context, height, width));
}, },
), ),
}, },
@ -1298,22 +1395,32 @@ class ColorPickerArea extends StatelessWidget {
case PaletteType.hsvWithHue: case PaletteType.hsvWithHue:
return CustomPaint(painter: HSVWithHueColorPainter(hsvColor)); return CustomPaint(painter: HSVWithHueColorPainter(hsvColor));
case PaletteType.hsvWithSaturation: case PaletteType.hsvWithSaturation:
return CustomPaint(painter: HSVWithSaturationColorPainter(hsvColor)); return CustomPaint(
painter: HSVWithSaturationColorPainter(hsvColor));
case PaletteType.hsvWithValue: case PaletteType.hsvWithValue:
return CustomPaint(painter: HSVWithValueColorPainter(hsvColor)); return CustomPaint(
painter: HSVWithValueColorPainter(hsvColor));
case PaletteType.hsl: case PaletteType.hsl:
case PaletteType.hslWithHue: case PaletteType.hslWithHue:
return CustomPaint(painter: HSLWithHueColorPainter(hsvToHsl(hsvColor))); return CustomPaint(
painter: HSLWithHueColorPainter(hsvToHsl(hsvColor)));
case PaletteType.hslWithSaturation: case PaletteType.hslWithSaturation:
return CustomPaint(painter: HSLWithSaturationColorPainter(hsvToHsl(hsvColor))); return CustomPaint(
painter:
HSLWithSaturationColorPainter(hsvToHsl(hsvColor)));
case PaletteType.hslWithLightness: case PaletteType.hslWithLightness:
return CustomPaint(painter: HSLWithLightnessColorPainter(hsvToHsl(hsvColor))); return CustomPaint(
painter:
HSLWithLightnessColorPainter(hsvToHsl(hsvColor)));
case PaletteType.rgbWithRed: case PaletteType.rgbWithRed:
return CustomPaint(painter: RGBWithRedColorPainter(hsvColor.toColor())); return CustomPaint(
painter: RGBWithRedColorPainter(hsvColor.toColor()));
case PaletteType.rgbWithGreen: case PaletteType.rgbWithGreen:
return CustomPaint(painter: RGBWithGreenColorPainter(hsvColor.toColor())); return CustomPaint(
painter: RGBWithGreenColorPainter(hsvColor.toColor()));
case PaletteType.rgbWithBlue: case PaletteType.rgbWithBlue:
return CustomPaint(painter: RGBWithBlueColorPainter(hsvColor.toColor())); return CustomPaint(
painter: RGBWithBlueColorPainter(hsvColor.toColor()));
case PaletteType.hueWheel: case PaletteType.hueWheel:
return CustomPaint(painter: HUEColorWheelPainter(hsvColor)); return CustomPaint(painter: HUEColorWheelPainter(hsvColor));
default: default:
@ -1342,7 +1449,8 @@ class ColorPickerHueRing extends StatelessWidget {
final bool displayThumbColor; final bool displayThumbColor;
final double strokeWidth; final double strokeWidth;
void _handleGesture(Offset position, BuildContext context, double height, double width) { void _handleGesture(
Offset position, BuildContext context, double height, double width) {
RenderBox? getBox = context.findRenderObject() as RenderBox?; RenderBox? getBox = context.findRenderObject() as RenderBox?;
if (getBox == null) return; if (getBox == null) return;
@ -1352,9 +1460,15 @@ class ColorPickerHueRing extends StatelessWidget {
Offset center = Offset(width / 2, height / 2); Offset center = Offset(width / 2, height / 2);
double radio = width <= height ? width / 2 : height / 2; double radio = width <= height ? width / 2 : height / 2;
double dist = sqrt(pow(horizontal - center.dx, 2) + pow(vertical - center.dy, 2)) / radio; double dist =
double rad = (atan2(horizontal - center.dx, vertical - center.dy) / pi + 1) / 2 * 360; sqrt(pow(horizontal - center.dx, 2) + pow(vertical - center.dy, 2)) /
if (dist > 0.7 && dist < 1.3) onColorChanged(hsvColor.withHue(((rad + 90) % 360).clamp(0, 360))); radio;
double rad =
(atan2(horizontal - center.dx, vertical - center.dy) / pi + 1) /
2 *
360;
if (dist > 0.7 && dist < 1.3)
onColorChanged(hsvColor.withHue(((rad + 90) % 360).clamp(0, 360)));
} }
@override @override
@ -1366,17 +1480,22 @@ class ColorPickerHueRing extends StatelessWidget {
return RawGestureDetector( return RawGestureDetector(
gestures: { gestures: {
_AlwaysWinPanGestureRecognizer: GestureRecognizerFactoryWithHandlers<_AlwaysWinPanGestureRecognizer>( _AlwaysWinPanGestureRecognizer:
GestureRecognizerFactoryWithHandlers<
_AlwaysWinPanGestureRecognizer>(
() => _AlwaysWinPanGestureRecognizer(), () => _AlwaysWinPanGestureRecognizer(),
(_AlwaysWinPanGestureRecognizer instance) { (_AlwaysWinPanGestureRecognizer instance) {
instance instance
..onDown = ((details) => _handleGesture(details.globalPosition, context, height, width)) ..onDown = ((details) => _handleGesture(
..onUpdate = ((details) => _handleGesture(details.globalPosition, context, height, width)); details.globalPosition, context, height, width))
..onUpdate = ((details) => _handleGesture(
details.globalPosition, context, height, width));
}, },
), ),
}, },
child: CustomPaint( child: CustomPaint(
painter: HueRingPainter(hsvColor, displayThumbColor: displayThumbColor, strokeWidth: strokeWidth), painter: HueRingPainter(hsvColor,
displayThumbColor: displayThumbColor, strokeWidth: strokeWidth),
), ),
); );
}, },
@ -1399,5 +1518,6 @@ class _AlwaysWinPanGestureRecognizer extends PanGestureRecognizer {
class UpperCaseTextFormatter extends TextInputFormatter { class UpperCaseTextFormatter extends TextInputFormatter {
@override @override
TextEditingValue formatEditUpdate(oldValue, TextEditingValue newValue) => TextEditingValue formatEditUpdate(oldValue, TextEditingValue newValue) =>
TextEditingValue(text: newValue.text.toUpperCase(), selection: newValue.selection); TextEditingValue(
text: newValue.text.toUpperCase(), selection: newValue.selection);
} }

@ -57,7 +57,9 @@ HSVColor hslToHsv(HSLColor color) {
double s = 0.0; double s = 0.0;
double v = 0.0; double v = 0.0;
v = color.lightness + color.saturation * (color.lightness < 0.5 ? color.lightness : 1 - color.lightness); v = color.lightness +
color.saturation *
(color.lightness < 0.5 ? color.lightness : 1 - color.lightness);
if (v != 0) s = 2 - 2 * color.lightness / v; if (v != 0) s = 2 - 2 * color.lightness / v;
return HSVColor.fromAHSV( return HSVColor.fromAHSV(
@ -94,7 +96,8 @@ const String kValidHexPattern = r'^#?[0-9a-fA-F]{1,8}';
/// if (hexCompleteValidator.hasMatch(hex)) print('$hex is valid HEX color'); /// if (hexCompleteValidator.hasMatch(hex)) print('$hex is valid HEX color');
/// ``` /// ```
/// Reference: https://en.wikipedia.org/wiki/Web_colors#Hex_triplet /// Reference: https://en.wikipedia.org/wiki/Web_colors#Hex_triplet
const String kCompleteValidHexPattern = r'^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$'; const String kCompleteValidHexPattern =
r'^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$';
/// Try to convert text input or any [String] to valid [Color]. /// Try to convert text input or any [String] to valid [Color].
/// The [String] must be provided in one of those formats: /// The [String] must be provided in one of those formats:
@ -212,6 +215,10 @@ extension ColorExtension1 on String {
// Extension from Color // Extension from Color
extension ColorExtension2 on Color { extension ColorExtension2 on Color {
String toHexString({bool includeHashSign = false, bool enableAlpha = true, bool toUpperCase = true}) => String toHexString(
colorToHex(this, includeHashSign: false, enableAlpha: true, toUpperCase: true); {bool includeHashSign = false,
bool enableAlpha = true,
bool toUpperCase = true}) =>
colorToHex(this,
includeHashSign: false, enableAlpha: true, toUpperCase: true);
} }

@ -2,7 +2,8 @@ import 'package:flutter/material.dart';
import '../../../../../translations.dart'; import '../../../../../translations.dart';
import '../../../../models/documents/style.dart'; import '../../../../models/documents/style.dart';
import '../../../../packages/flutter_colorpicker/flutter_colorpicker.dart' show ColorPicker, MaterialPicker, colorToHex; import '../../../../packages/flutter_colorpicker/flutter_colorpicker.dart'
show ColorPicker, MaterialPicker, colorToHex;
import 'color_button.dart' show hexToColor; import 'color_button.dart' show hexToColor;
enum _PickerType { enum _PickerType {

Loading…
Cancel
Save