-
-
Notifications
You must be signed in to change notification settings - Fork 41
/
show_color_picker_dialog.dart
714 lines (640 loc) · 27.6 KB
/
show_color_picker_dialog.dart
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
part of 'color_picker.dart';
/// Define a color picker, show its dialog and wait for it to return a color.
///
Future<Color> showColorPickerDialog(
/// Required build context for the dialog
BuildContext context,
/// The active color selection when the color picker is created.
Color color, {
/// A [ColorPickerType] to bool map. Defines which pickers are enabled in the
/// color picker's sliding selector and thus available as color pickers.
///
/// Available options are based on the [ColorPickerType] enum that
/// includes values `both`, `primary`, `accent`, `bw`, `custom` and `wheel`.
///
/// By default, a map that sets primary and accent pickers to true, and
/// other pickers to false, is used.
///
/// To modify key-value enable/disable pairs, you only have to provide values
/// for the pairs you want to change from their default value. Any missing
/// key-value pair in the provided map will keep their default value.
Map<ColorPickerType, bool> pickersEnabled = const <ColorPickerType, bool>{
ColorPickerType.both: false,
ColorPickerType.primary: true,
ColorPickerType.accent: true,
ColorPickerType.bw: false,
ColorPickerType.custom: false,
ColorPickerType.wheel: false,
},
/// Set to true to allow selection of color swatch shades.
///
/// If false, only the main color from a swatch is shown and can be selected.
/// This is index [500] for Material primary colors and index [200] for accent
/// colors. On the Wheel, only the selected color is shown there is no
/// color related color swatch of the selected color shown.
///
/// Defaults to true.
bool enableShadesSelection = true,
/// There is an extra index [850] used only by grey Material color in Flutter.
/// If you want to include it in the grey color shades selection, then set
/// this property to true.
///
/// Defaults to false.
bool includeIndex850 = false,
/// Set to true to allow selection of color tone from a tonal palette.
///
/// When set to true, the ColorPicker will use Material 3 color utilities
/// to compute a tonal palette for the selected color, allowing you to
/// select a color tone from the Tonal Palette for the selected color.
///
/// For more info on Material 3 Color system, see:
/// https://m3.material.io/styles/color/the-color-system/key-colors-tones
///
/// The picker item size for tonal palette color indicator items is
/// 10/13 the size of defined width and height. This is done in order to
/// as far as possible try to match the width of the Primary Material Swatch
/// items total width, it has 10 colors, the M3 tonal palette has 13 colors.
/// The idea is try to match their width when they are both shown.
///
/// Defaults to false.
final bool enableTonalPalette = false,
/// Cross axis alignment used to layout the main content of the
/// color picker in its column layout.
///
/// Defaults to CrossAxisAlignment.center.
CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
/// Padding around the entire color picker content.
///
/// Defaults to const EdgeInsets.all(16).
EdgeInsetsGeometry padding = const EdgeInsets.all(16),
/// Vertical spacing between items in the color picker column.
///
/// Defaults to 8 dp. Must be from 0 to 300 dp.
double columnSpacing = 8,
/// Enable the opacity control for the color value.
///
/// Set to true to allow users to control the opacity value of the
/// selected color. The displayed Opacity value on the slider goes from 0%,
/// which is totally transparent, to 100%, which if fully opaque.
///
/// When enabled, the opacity value is not returned as a separate value,
/// it is returned in the alpha channel of the returned ARGB color value, in
/// the onColor callbacks.
///
/// Defaults to false.
bool enableOpacity = false,
/// The height of the opacity slider track.
///
/// Defaults to 36 dp
double opacityTrackHeight = 36,
/// The width of the opacity slider track.
///
/// If null, the slider fills to expand available width of the picker.
/// If not null, it must be >= 150 dp.
double? opacityTrackWidth,
/// The radius of the thumb on the opacity slider.
///
/// Defaults to 16 dp.
double opacityThumbRadius = 16,
/// Used to configure action buttons for the color picker dialog.
///
/// Defaults to [ColorPickerActionButtons] ().
ColorPickerActionButtons actionButtons = const ColorPickerActionButtons(),
/// Used to configure the copy paste behavior of the color picker.
///
/// Defaults to [ColorPickerCopyPasteBehavior] ().
ColorPickerCopyPasteBehavior copyPasteBehavior =
const ColorPickerCopyPasteBehavior(),
/// Icon data for the icon used to indicate the selected color.
///
/// The size of the `selectedColorIcon` is 60% of the smaller of color
/// indicator `width` and `height`. The color of indicator icon is
/// black or white, based on what contrast best with the selected color.
///
/// Defaults to a check mark [Icons.check].
IconData selectedColorIcon = Icons.check,
/// Width of the color indicator items.
///
/// Defaults to 40 dp. Must be from 15 to 150 dp.
double width = 40.0,
/// Height of the color indicator items.
///
/// Defaults to 40 dp. Must be from 15 to 150 dp.
double height = 40.0,
/// The horizontal spacing between the color picker indicator items.
///
/// Defaults to 4 dp. Must be from 0 to 50 dp.
double spacing = 4,
/// The space between the color picker color item rows, when they need to
/// be wrapped to multiple rows.
///
/// Defaults to 4 dp. Must be from 0 to 50 dp.
double runSpacing = 4,
/// The Material elevation of the color indicator items.
///
/// Defaults to 0 dp. Must be >= 0.
double elevation = 0,
/// Set to true, to show a 1 dp border around the color indicator items.
///
/// This property is useful if the white/near white and black/near black
/// shades color picker is enabled.
///
/// Defaults to false.
bool hasBorder = false,
/// Border radius of the color indicator items.
///
/// If null, it defaults to `width`/4. Must be from 0 to 50 dp, if not null.
double? borderRadius,
/// The color of the 1 dp optional border used on [ColorIndicator] and on
/// [ColorWheelPicker], when each have their border toggle set to true.
///
/// If no color is given, the border color defaults to
/// Theme.of(context).dividerColor.
Color? borderColor,
/// Diameter of the HSV based color wheel picker.
///
/// Defaults to 190 dp. Must be from 100 to maximum 500 dp.
double wheelDiameter = 190,
/// The stroke width of the color wheel circle.
///
/// Defaults to 16 dp. Must be from 4 to maximum 50 dp.
double wheelWidth = 16,
/// Padding between shade square inside the hue wheel and inner
/// side of the wheel.
///
/// Keep it reasonable in relation to wheelDiameter and wheelWidth, values
/// from 0 to 20 are recommended.
///
/// Defaults to 0 dp.
double wheelSquarePadding = 0,
/// Border radius of the shade square inside the hue wheel.
///
/// Keep it reasonable, the thumb center always goes out to the square box
/// corner, regardless of this border radius. It is only for visual design,
/// the edge color shades are in the sharp corner, even if not shown.
///
/// Recommended values 0 to 16.
///
/// Defaults to 4 dp.
double wheelSquareBorderRadius = 4,
/// Set to true to show a 1 dp border around the color wheel.
///
/// Defaults to false.
bool wheelHasBorder = false,
/// Title widget for the color picker.
///
/// Typically a Text widget, e.g. `Text('ColorPicker')`. If not provided or
/// null, there is no title on the toolbar of the color picker.
///
/// This widget can be used instead of `heading` or with it, depends on design
/// need.
///
/// The title widget is like an app bar title in the sense that at
/// the end of it, 1 to 4 actions buttons may also be present for copy, paste,
/// select-close and cancel-close. The select-close and cancel-close actions
/// should only be enabled when the picker is used in a dialog. The copy and
/// paste actions can be enabled also when the picker is not in a dialog.
Widget? title,
/// Heading widget for the color picker.
///
/// Typically a Text widget, e.g. `Text('Select color')`.
/// If not provided or null, there is no heading for the color picker.
Widget? heading,
/// Subheading widget for the color shades selection.
///
/// Typically a Text widget, e.g. `Text('Select color shade')`.
/// If not provided or null, there is no subheading for the color shades.
Widget? subheading,
/// Subheading widget for the color tone selection.
///
/// Typically a Text widget, e.g. `Text('Select color shade')`.
/// If not provided or null, there is no subheading for the color shades.
Widget? tonalSubheading,
/// Subheading widget for the HSV color wheel picker.
///
/// Typically a Text widget, e.g.
/// `Text('Selected color and its material like shades')`.
///
/// The color wheel uses a separate subheading widget so that it may have
/// another explanation, since its use case differs from the other subheading
/// cases. If not provided, there is no subheading for the color wheel picker.
Widget? wheelSubheading,
/// Subheading widget for the recently used colors.
///
/// Typically a Text widget, e.g. `Text('Recent colors')`.
/// If not provided or null, there is no subheading for the recent color.
/// The recently used colors subheading is not shown even if provided, when
/// `showRecentColors` is false.
Widget? recentColorsSubheading,
/// Subheading widget for the opacity slider.
///
/// Typically a Text widget, e.g. `Text('Opacity')`.
/// If not provided or null, there is no subheading for the opacity slider.
/// The opacity subheading is not shown even if provided, when
/// `enableOpacity` is false.
Widget? opacitySubheading,
/// Set to true to show the Material name and index of the selected `color`.
///
/// Defaults to false.
bool showMaterialName = false,
/// Text style for the displayed material color name in the picker.
///
/// Defaults to `Theme.of(context).textTheme.bodyMedium`, if not defined.
TextStyle? materialNameTextStyle,
/// Set to true to show an English color name of the selected `color`.
///
/// Uses the `ColorTools.nameThatColor` function to give an English name to
/// any selected color. The function has a list of 1566 color codes and
/// their names, it finds the color that closest matches the given color in
/// the list and returns its color name.
///
/// Defaults to false.
bool showColorName = false,
/// Text style for the displayed color name in the picker.
///
/// Defaults to `Theme.of(context).textTheme.bodyMedium`, if not defined.
TextStyle? colorNameTextStyle,
/// Set to true to show the RGB Hex color code of the selected `color`.
///
/// The color code can be copied with copy icon button or other enabled copy
/// actions in the color picker. On the wheel picker the color code can be
/// edited to enter and select a color of a known RGB hex value. If the
/// property `colorCodeReadOnly` has been set to false the color code field
/// can never be edited directly, it is then only used to display the code
/// of currently selected color.
///
/// Defaults to false.
bool showColorCode = false,
/// When true, the color code entry field uses the currently selected
/// color as its background color.
///
/// This makes the color code entry field a large current color indicator
/// area, that changes color as the color value is changed.
/// The text color of the field, will automatically adjust for best contrast,
/// as will the opacity indicator text. Enabling this feature will override
/// any color specified in `colorCodeTextStyle` and `colorCodePrefixStyle`,
/// but their styles will otherwise be kept as specified.
///
/// Defaults to false.
bool colorCodeHasColor = false,
/// Text style for the displayed generic color name in the picker.
///
/// Defaults to `Theme.of(context).textTheme.bodyMedium`, if not defined.
TextStyle? colorCodeTextStyle,
/// The TextStyle of the prefix of the color code.
///
/// The prefix always include the alpha value and may also include a num char
/// '#' or '0x' based on the `ColorPickerCopyPasteBehavior.copyFormat`
/// setting.
///
/// Defaults to `colorCodeTextStyle`, if not defined.
TextStyle? colorCodePrefixStyle,
/// When true, the color code field is always read only.
///
/// If set to true, the color code field cannot be edited. Normally it can
/// be edited when used in a picker that can select and show any color.
/// Setting this to false makes it read only also on such pickers. This
/// currently only applies to the wheel picker, but will also apply to
/// future full color range pickers.
///
/// Pickers that only offer a fixed palette, that you can just offered colors
/// from always have the color code field in read only mode, this setting
/// does not affect them.
///
/// Regardless of the picker and `colorCodeReadOnly` value, you can change
/// color value by pasting in a new value, if your copy paste configuration
/// allows it.
///
/// Defaults to false.
bool colorCodeReadOnly = false,
/// Set to true to show the int [Color.value] of the selected `color`.
///
/// This is a developer feature, showing the int color value can be
/// useful during software development. If enabled the value is shown after
/// the color code. For text style it also uses the `colorCodeTextStyle`.
/// There is no copy button for the shown int value, but the value is
/// displayed with a [SelectableText] widget, so it can be select painted
/// and copied if so required.
///
/// Defaults to false.
bool showColorValue = false,
/// Set to true to a list of recently selected colors selection at the bottom
/// of the picker.
///
/// When `showRecentColors` is enabled, the color picker shows recently
/// selected colors in a list at the bottom of the color picker. The list
/// uses first-in, first-out to keep min 2 to max 20 colors (defaults to 5)
/// on the recently used colors list, the desired max value can be modified
/// with `maxRecentColors`.
///
/// Defaults to false.
bool showRecentColors = false,
/// The maximum numbers of recent colors to show in the list of recent colors.
///
/// The max recent colors must be from 2 to 20. Defaults to 5.
int maxRecentColors = 5,
/// A list with the recently select colors.
///
/// Defaults to an empty list of colors. You can provide a starting
/// set from some stored state if so desired.
List<Color> recentColors = const <Color>[],
/// Set to true to enable all tooltips in this widget.
///
/// When true, it enables all tooltips that are available in the color picker.
/// If the tooltips get in the way you can disable them all by setting this
/// property to `false`. Why not consider providing a setting in your app that
/// allows users to turn ON and OFF the tooltips in the app? FlexColorPicker
/// includes this toggle to make that easy to implement when it comes to its
/// tooltip behavior.
///
/// Defaults to true.
bool enableTooltips = true,
/// The color on the thumb of the slider that shows the selected picker type.
///
/// If not defined, it defaults to `Color(0xFFFFFFFF)` (white) in light
/// theme and to `Color(0xFF636366)` in dark theme, which are the defaults
/// for the used [CupertinoSlidingSegmentedControl].
///
/// If you give it a custom color, the color picker will automatically adjust
/// the text color on the selected thumb for best legible text contrast.
Color? selectedPickerTypeColor,
/// The TextStyle of the labels in segmented color picker type selector.
///
/// Defaults to `Theme.of(context).textTheme.bodySmall`, if not defined.
TextStyle? pickerTypeTextStyle,
/// A [ColorPickerType] to String map that contains labels for the picker
/// type selector.
///
/// If not defined, or omitted in provided mpa, then the following default
/// English labels are used:
/// * [ColorPickerType.both] : 'Both'
/// * [ColorPickerType.primary] : 'Primary & Accent'
/// * [ColorPickerType.accent] : 'Primary'
/// * [ColorPickerType.bw] : 'Black & White'
/// * [ColorPickerType.custom] : 'Custom'
/// * [ColorPickerType.wheel] : 'Wheel'
Map<ColorPickerType, String> pickerTypeLabels =
const <ColorPickerType, String>{
ColorPickerType.primary: ColorPicker._selectPrimaryLabel,
ColorPickerType.accent: ColorPicker._selectAccentLabel,
ColorPickerType.bw: ColorPicker._selectBlackWhiteLabel,
ColorPickerType.both: ColorPicker._selectBothLabel,
ColorPickerType.custom: ColorPicker._selectCustomLabel,
ColorPickerType.wheel: ColorPicker._selectWheelAnyLabel,
},
/// Color swatch to name map, with custom swatches and their names.
///
/// Used to provide custom [ColorSwatch] objects to the custom color picker,
/// including their custom name label. These colors, their swatch shades
/// and names, are shown and used when the picker type
/// [ColorPickerType.custom] option is enabled in the color picker.
///
/// Defaults to an empty map. If the map is empty, the custom colors picker
/// will not be shown even if it is enabled in `pickersEnabled`.
Map<ColorSwatch<Object>, String> customColorSwatchesAndNames =
const <ColorSwatch<Object>, String>{},
// ***************************************************************************
// Below properties that refer to the dialog
// ***************************************************************************
/// Title of the color picker dialog, often omitted in favor of using a
/// `title` and/or `heading` already defined in the [ColorPicker].
Widget? dialogTitle,
/// Padding around the dialog title, if a title is used.
/// Defaults to `EdgeInsets.zero`, since the title is normally omitted
/// and provided via the `heading` property of the `ColorPicker` instead.
final EdgeInsetsGeometry titlePadding = EdgeInsets.zero,
/// Style for the text in the dialog `title` of this `AlertDialog`.
///
/// If null, `DialogTheme.titleTextStyle` is used. If that's null,
/// defaults to `TextTheme.titleLarge` of `ThemeData.textTheme`.
final TextStyle? titleTextStyle,
/// Padding around the content in the dialog.
///
/// Defaults to `EdgeInsets.zero`, as the content padding is expected to
/// be a part of the `ColorPicker`.
final EdgeInsetsGeometry contentPadding = EdgeInsets.zero,
/// Padding around the Cancel and OK action buttons at the bottom of
/// the dialog.
///
/// Typically used to provide padding to the button bar between the button
/// bar and the edges of the dialog.
///
/// Defaults to `EdgeInsets.symmetric(horizontal: 16)`.
final EdgeInsetsGeometry actionsPadding =
const EdgeInsets.symmetric(horizontal: 16),
/// The padding that surrounds each bottom action button.
///
/// This is different from [actionsPadding], which defines the padding
/// between the entire button bar and the edges of the dialog.
///
/// Defaults to `EdgeInsets.all(16)`.
final EdgeInsetsGeometry buttonPadding = const EdgeInsets.all(16),
/// The background color of the surface of this Dialog.
///
/// This sets the Material.color on this Dialog's Material.
/// If null, ThemeData.dialogBackgroundColor is used.
///
/// NOTE: The ColorPicker is designed to fit on background color with
/// brightness that follow active theme mode. Putting e.g. white as
/// background in dark theme mode, will not produce usable results.
final Color? backgroundColor,
/// The z-coordinate of this Dialog.
///
/// If null then DialogTheme.elevation is used, and if that's null then the
/// dialog's elevation is 24.0. The z-coordinate at which to place this
/// material relative to its parent.
///
/// This controls the size of the shadow below the material and the opacity
/// of the elevation overlay color if it is applied. If this is non-zero,
/// the contents of the material are clipped, because the widget
/// conceptually defines an independent printed piece of material.
/// Changing this value will cause the shadow and the elevation
/// overlay to animate over Material.animationDuration.
///
/// Defaults to 0.
final double? dialogElevation,
/// The semantic label of the dialog used by accessibility frameworks to
/// announce screen transitions when the dialog is opened and closed.
///
/// In iOS, if this label is not provided, a semantic label will be inferred
/// from the [title] if it is not null.
///
/// In Android, if this label is not provided, the dialog will use the
/// [MaterialLocalizations.alertDialogLabel] as its label.
///
/// See also:
///
/// * [SemanticsConfiguration.namesRoute], for a description of how this
/// value is used.
final String? semanticLabel,
/// The amount of padding added to `MediaQueryData.viewInsets` on the
/// outside of the `ColorPicker` dialog.
///
/// Defines the minimum space between the screen's edges and the dialog.
/// Defaults to `EdgeInsets.symmetric(horizontal: 40, vertical: 24)`.
final EdgeInsets insetPadding =
const EdgeInsets.symmetric(horizontal: 40, vertical: 24),
/// Controls how the contents of the dialog are clipped (or not) to the
/// given shape.
///
/// See the enum `Clip` for details of all possible options and their
/// common use cases.
///
/// Defaults to Clip.none, and must not be null.
final Clip clipBehavior = Clip.none,
/// The shape of this dialog's border.
///
/// Defines the dialog's Material.shape.
///
/// The default shape is a RoundedRectangleBorder with a radius of 4.0.
final ShapeBorder? shape,
/// If true, the dialog can be closed by clicking outside it.
///
/// Defaults to true.
bool barrierDismissible = true,
/// The background transparency color of the dialog barrier.
///
/// Defaults to [Colors.black12] which is considerably lighter than the
/// standard [Colors.black54] and allows us to see the impact of selected
/// color on app behind the dialog. If this is not desired, set it back to
/// [Colors.black54] when you call `showColorPickerDialog`, or make it
/// even more transparent.
///
/// You can also make the barrier completely transparent.
Color barrierColor = Colors.black12,
/// The `useSafeArea` argument is used to indicate if the dialog should only
/// display in 'safe' areas of the screen not used by the operating system
/// (see [SafeArea] for more details).
///
/// Default to `true` by default, which means the dialog will not overlap
/// operating system areas. If it is set to `false` the dialog will only
/// be constrained by the screen size.
bool useSafeArea = true,
/// Usage of `useRootNavigator` here is deprecated.
///
/// The `useRootNavigator` argument is now respected on all Navigator
/// pop functions used in the [ColorPicker] widget itself and by
/// built-in dialogs used by the [ColorPicker]. In order to support this,
/// the current `useRootNavigator` property in the
/// [ColorPicker.showPickerDialog] and in the function
/// [showColorPickerDialog] had to be deprecated.
///
/// The property has moved to become a configuration option in
/// [ColorPickerActionButtons] class in order to make it accessible to
/// the Navigator pop functions both in the [ColorPicker] widget itself,
/// as well as by built-in dialogs.
///
/// The default behavior has not been changed, the setting still defaults
/// to using dialogs that use the root navigator, but now the pop
/// functions work as intended.
///
/// If you for some reason have used none root navigators for the built-in
/// dialogs in previous version, you need to set
/// `ColorPickerActionButtons(useRootNavigator: false)` in
/// `ColorPicker(actionButtons)` or `showColorPickerDialog(actionButtons)`.
@Deprecated(
'This property is no longer set here and has no function if assigned here. '
'From version 2.1.0 it must be defined via same property in configuration '
'class ColorPickerActionButtons(useRootNavigator).',
)
bool useRootNavigator = true,
/// The `routeSettings` argument is passed to [showGeneralDialog],
/// see [RouteSettings] for details.
RouteSettings? routeSettings,
/// You can provide BoxConstraints to constrain the size of the dialog.
///
/// You might want to do this at least for the height, otherwise
/// the dialog height might jump up and down jarringly if its size changes
/// when user changes the picker type with the selector.¨
///
/// Normally you would not change the picker's content element sizes after
/// you have determined what works in your implementation. You can usually
/// figure out a good dialog box size that works well for your use case,
/// for all active pickers, instead of allowing the color picker dialog
/// to auto size itself, which it will do if no constraints are defined.
BoxConstraints? constraints,
}
/// Picker properties
) async {
Color selectedColor = color;
// ignore: use_build_context_synchronously
if (!(await ColorPicker(
color: color,
onColorChanged: (Color newColor) {
selectedColor = newColor;
},
pickersEnabled: pickersEnabled,
enableShadesSelection: enableShadesSelection,
includeIndex850: includeIndex850,
enableTonalPalette: enableTonalPalette,
crossAxisAlignment: crossAxisAlignment,
padding: padding,
columnSpacing: columnSpacing,
enableOpacity: enableOpacity,
opacityTrackHeight: opacityTrackHeight,
opacityTrackWidth: opacityTrackWidth,
opacityThumbRadius: opacityThumbRadius,
actionButtons: actionButtons,
copyPasteBehavior: copyPasteBehavior,
selectedColorIcon: selectedColorIcon,
width: width,
height: height,
spacing: spacing,
runSpacing: runSpacing,
elevation: elevation,
hasBorder: hasBorder,
borderRadius: borderRadius,
borderColor: borderColor,
wheelDiameter: wheelDiameter,
wheelWidth: wheelWidth,
wheelSquarePadding: wheelSquarePadding,
wheelSquareBorderRadius: wheelSquareBorderRadius,
wheelHasBorder: wheelHasBorder,
title: title,
heading: heading,
subheading: subheading,
wheelSubheading: wheelSubheading,
recentColorsSubheading: recentColorsSubheading,
opacitySubheading: opacitySubheading,
showMaterialName: showMaterialName,
materialNameTextStyle: materialNameTextStyle,
showColorName: showColorName,
colorNameTextStyle: colorNameTextStyle,
showColorCode: showColorCode,
colorCodeHasColor: colorCodeHasColor,
colorCodeTextStyle: colorCodeTextStyle,
colorCodePrefixStyle: colorCodePrefixStyle,
colorCodeReadOnly: colorCodeReadOnly,
showColorValue: showColorValue,
showRecentColors: showRecentColors,
maxRecentColors: maxRecentColors,
recentColors: recentColors,
enableTooltips: enableTooltips,
selectedPickerTypeColor: selectedPickerTypeColor,
pickerTypeTextStyle: pickerTypeTextStyle,
pickerTypeLabels: pickerTypeLabels,
customColorSwatchesAndNames: customColorSwatchesAndNames,
).showPickerDialog(
context,
title: dialogTitle,
titlePadding: titlePadding,
titleTextStyle: titleTextStyle,
contentPadding: contentPadding,
actionsPadding: actionsPadding,
buttonPadding: buttonPadding,
backgroundColor: backgroundColor,
elevation: dialogElevation,
semanticLabel: semanticLabel,
insetPadding: insetPadding,
clipBehavior: clipBehavior,
shape: shape,
barrierDismissible: barrierDismissible,
barrierColor: barrierColor,
useSafeArea: useSafeArea,
routeSettings: routeSettings,
constraints: constraints,
))) {
selectedColor = color;
}
return selectedColor;
}