@@ -9,23 +9,31 @@ import 'package:flutter/material.dart';
9
9
10
10
void main () => runApp (const DropdownMenuExample ());
11
11
12
- class DropdownMenuExample extends StatelessWidget {
12
+ class DropdownMenuExample extends StatefulWidget {
13
13
const DropdownMenuExample ({super .key});
14
14
15
- List <DropdownMenuEntry > getEntryList () {
16
- final List <DropdownMenuEntry > entries = < DropdownMenuEntry > [];
15
+ @override
16
+ State <DropdownMenuExample > createState () => _DropdownMenuExampleState ();
17
+ }
17
18
18
- for (int index = 0 ; index < EntryLabel .values.length; index++ ) {
19
- // Disabled item 1, 2 and 6.
20
- final bool enabled = index != 1 && index != 2 && index != 6 ;
21
- entries.add (DropdownMenuEntry (label: EntryLabel .values[index].label, enabled: enabled));
22
- }
23
- return entries;
24
- }
19
+ class _DropdownMenuExampleState extends State <DropdownMenuExample > {
20
+ final TextEditingController colorController = TextEditingController ();
21
+ final TextEditingController iconController = TextEditingController ();
22
+ ColorLabel ? selectedColor;
23
+ IconLabel ? selectedIcon;
25
24
26
25
@override
27
26
Widget build (BuildContext context) {
28
- final List <DropdownMenuEntry > dropdownMenuEntries = getEntryList ();
27
+ final List <DropdownMenuEntry <ColorLabel >> colorEntries = < DropdownMenuEntry <ColorLabel >> [];
28
+ for (final ColorLabel color in ColorLabel .values) {
29
+ colorEntries.add (
30
+ DropdownMenuEntry <ColorLabel >(value: color, label: color.label, enabled: color.label != 'Grey' ));
31
+ }
32
+
33
+ final List <DropdownMenuEntry <IconLabel >> iconEntries = < DropdownMenuEntry <IconLabel >> [];
34
+ for (final IconLabel icon in IconLabel .values) {
35
+ iconEntries.add (DropdownMenuEntry <IconLabel >(value: icon, label: icon.label));
36
+ }
29
37
30
38
return MaterialApp (
31
39
theme: ThemeData (
@@ -34,41 +42,79 @@ class DropdownMenuExample extends StatelessWidget {
34
42
),
35
43
home: Scaffold (
36
44
body: SafeArea (
37
- child: Padding (
38
- padding: const EdgeInsets .only (top: 20 ),
39
- child: Row (
40
- mainAxisAlignment: MainAxisAlignment .center,
41
- children: < Widget > [
42
- DropdownMenu (
43
- label: const Text ('Label' ),
44
- dropdownMenuEntries: dropdownMenuEntries,
45
+ child: Column (
46
+ children: < Widget > [
47
+ Padding (
48
+ padding: const EdgeInsets .symmetric (vertical: 20 ),
49
+ child: Row (
50
+ mainAxisAlignment: MainAxisAlignment .center,
51
+ children: < Widget > [
52
+ DropdownMenu <ColorLabel >(
53
+ initialSelection: ColorLabel .green,
54
+ controller: colorController,
55
+ label: const Text ('Color' ),
56
+ dropdownMenuEntries: colorEntries,
57
+ onSelected: (ColorLabel ? color) {
58
+ setState (() {
59
+ selectedColor = color;
60
+ });
61
+ },
62
+ ),
63
+ const SizedBox (width: 20 ),
64
+ DropdownMenu <IconLabel >(
65
+ controller: iconController,
66
+ enableFilter: true ,
67
+ leadingIcon: const Icon (Icons .search),
68
+ label: const Text ('Icon' ),
69
+ dropdownMenuEntries: iconEntries,
70
+ inputDecorationTheme: const InputDecorationTheme (filled: true ),
71
+ onSelected: (IconLabel ? icon) {
72
+ setState (() {
73
+ selectedIcon = icon;
74
+ });
75
+ },
76
+ )
77
+ ],
45
78
),
46
- const SizedBox (width: 20 ),
47
- DropdownMenu (
48
- enableFilter: true ,
49
- leadingIcon: const Icon (Icons .search),
50
- label: const Text ('Label' ),
51
- dropdownMenuEntries: dropdownMenuEntries,
52
- inputDecorationTheme: const InputDecorationTheme (filled: true ),
79
+ ),
80
+ if (selectedColor != null && selectedIcon != null )
81
+ Row (
82
+ mainAxisAlignment: MainAxisAlignment .center,
83
+ children: < Widget > [
84
+ Text ('You selected a ${selectedColor ?.label } ${selectedIcon ?.label }' ),
85
+ Padding (
86
+ padding: const EdgeInsets .symmetric (horizontal: 5 ),
87
+ child: Icon (selectedIcon? .icon, color: selectedColor? .color,))
88
+ ],
53
89
)
54
- ],
55
- ) ,
90
+ else const Text ( 'Please select a color and an icon.' )
91
+ ] ,
56
92
)
57
93
),
58
94
),
59
95
);
60
96
}
61
97
}
62
98
63
- enum EntryLabel {
64
- item0 ('Item 0' ),
65
- item1 ('Item 1' ),
66
- item2 ('Item 2' ),
67
- item3 ('Item 3' ),
68
- item4 ('Item 4' ),
69
- item5 ('Item 5' ),
70
- item6 ('Item 6' );
99
+ enum ColorLabel {
100
+ blue ('Blue' , Colors .blue),
101
+ pink ('Pink' , Colors .pink),
102
+ green ('Green' , Colors .green),
103
+ yellow ('Yellow' , Colors .yellow),
104
+ grey ('Grey' , Colors .grey);
105
+
106
+ const ColorLabel (this .label, this .color);
107
+ final String label;
108
+ final Color color;
109
+ }
110
+
111
+ enum IconLabel {
112
+ smile ('Smile' , Icons .sentiment_satisfied_outlined),
113
+ cloud ('Cloud' , Icons .cloud_outlined,),
114
+ brush ('Brush' , Icons .brush_outlined),
115
+ heart ('Heart' , Icons .favorite);
71
116
72
- const EntryLabel (this .label);
117
+ const IconLabel (this .label, this .icon );
73
118
final String label;
119
+ final IconData icon;
74
120
}
0 commit comments