@@ -28,186 +28,183 @@ final _formKey = GlobalKey<FormBuilderState>();
28
28
...
29
29
30
30
@override
31
- Widget build(BuildContext context) {
32
- return Column(
33
- children: <Widget>[
34
- FormBuilder(
35
- key: _formKey,
36
- autovalidate: true,
37
- child: Column(
38
- children: <Widget>[
39
- FormBuilderFilterChip(
40
- name: 'filter_chip',
41
- decoration: InputDecoration(
42
- labelText: 'Select many options',
43
- ),
44
- options: [
45
- FormBuilderFieldOption(
46
- value: 'Test', child: Text('Test')),
47
- FormBuilderFieldOption(
48
- value: 'Test 1', child: Text('Test 1')),
49
- FormBuilderFieldOption(
50
- value: 'Test 2', child: Text('Test 2')),
51
- FormBuilderFieldOption(
52
- value: 'Test 3', child: Text('Test 3')),
53
- FormBuilderFieldOption(
54
- value: 'Test 4', child: Text('Test 4')),
55
- ],
56
- ),
57
- FormBuilderChoiceChip(
58
- name: 'choice_chip',
59
- decoration: InputDecoration(
60
- labelText: 'Select an option',
31
+ Widget build(BuildContext context) {
32
+ return Column(
33
+ children: <Widget>[
34
+ FormBuilder(
35
+ key: _formKey,
36
+ autovalidateMode: AutovalidateMode.disabled,
37
+ child: Column(
38
+ children: <Widget>[
39
+ FormBuilderFilterChip(
40
+ name: 'filter_chip',
41
+ decoration: const InputDecoration(
42
+ labelText: 'Select many options',
43
+ ),
44
+ options: const [
45
+ FormBuilderFieldOption(value: 'Test', child: Text('Test')),
46
+ FormBuilderFieldOption(
47
+ value: 'Test 1', child: Text('Test 1')),
48
+ FormBuilderFieldOption(
49
+ value: 'Test 2', child: Text('Test 2')),
50
+ FormBuilderFieldOption(
51
+ value: 'Test 3', child: Text('Test 3')),
52
+ FormBuilderFieldOption(
53
+ value: 'Test 4', child: Text('Test 4')),
54
+ ],
61
55
),
62
- options: [
63
- FormBuilderFieldOption(
64
- value: 'Test', child: Text('Test')),
65
- FormBuilderFieldOption(
66
- value: 'Test 1', child: Text('Test 1')),
67
- FormBuilderFieldOption(
68
- value: 'Test 2', child: Text('Test 2')),
69
- FormBuilderFieldOption(
70
- value: 'Test 3', child: Text('Test 3')),
71
- FormBuilderFieldOption(
72
- value: 'Test 4', child: Text('Test 4')),
73
- ],
74
- ),
75
- FormBuilderDateTimePicker(
76
- name: 'date',
77
- // onChanged: _onChanged,
78
- inputType: InputType.time,
79
- decoration: InputDecoration(
80
- labelText: 'Appointment Time',
56
+ FormBuilderChoiceChip(
57
+ name: 'choice_chip',
58
+ decoration: const InputDecoration(
59
+ labelText: 'Select an option',
60
+ ),
61
+ options: const [
62
+ FormBuilderFieldOption(value: 'Test', child: Text('Test')),
63
+ FormBuilderFieldOption(
64
+ value: 'Test 1', child: Text('Test 1')),
65
+ FormBuilderFieldOption(
66
+ value: 'Test 2', child: Text('Test 2')),
67
+ FormBuilderFieldOption(
68
+ value: 'Test 3', child: Text('Test 3')),
69
+ FormBuilderFieldOption(
70
+ value: 'Test 4', child: Text('Test 4')),
71
+ ],
81
72
),
82
- initialTime: TimeOfDay(hour: 8, minute: 0),
83
- // initialValue: DateTime.now(),
84
- // enabled: true,
85
- ),
86
- FormBuilderDateRangePicker(
87
- name: 'date_range',
88
- firstDate: DateTime(1970),
89
- lastDate: DateTime(2030),
90
- format: DateFormat('yyyy-MM-dd'),
91
- onChanged: _onChanged,
92
- decoration: InputDecoration(
93
- labelText: 'Date Range',
94
- helperText: 'Helper text',
95
- hintText: 'Hint text',
73
+ FormBuilderDateTimePicker(
74
+ name: 'date',
75
+ // onChanged: _onChanged,
76
+ inputType: InputType.time,
77
+ decoration: const InputDecoration(
78
+ labelText: 'Appointment Time',
79
+ ),
80
+ initialTime: const TimeOfDay(hour: 8, minute: 0),
81
+ // initialValue: DateTime.now(),
82
+ // enabled: true,
96
83
),
97
- ),
98
- FormBuilderSlider(
99
- name: 'slider',
100
- validator: FormBuilderValidators.compose([
101
- FormBuilderValidators.min(context, 6),
102
- ]),
103
- onChanged: _onChanged,
104
- min: 0.0,
105
- max: 10.0,
106
- initialValue: 7.0,
107
- divisions: 20,
108
- activeColor: Colors.red,
109
- inactiveColor: Colors.pink[100],
110
- decoration: InputDecoration(
111
- labelText: 'Number of things',
84
+ FormBuilderDateRangePicker(
85
+ name: 'date_range',
86
+ firstDate: DateTime(1970),
87
+ lastDate: DateTime(2030),
88
+ format: DateFormat('yyyy-MM-dd'),
89
+ onChanged: _onChanged,
90
+ decoration: const InputDecoration(
91
+ labelText: 'Date Range',
92
+ helperText: 'Helper text',
93
+ hintText: 'Hint text',
94
+ ),
112
95
),
113
- ),
114
- FormBuilderCheckbox(
115
- name: 'accept_terms',
116
- initialValue: false,
117
- onChanged: _onChanged,
118
- title: RichText(
119
- text: TextSpan(
120
- children: [
121
- TextSpan(
122
- text: 'I have read and agree to the ',
123
- style: TextStyle(color: Colors.black),
124
- ),
125
- TextSpan(
126
- text: 'Terms and Conditions',
127
- style: TextStyle(color: Colors.blue),
128
- ),
129
- ],
96
+ FormBuilderSlider(
97
+ name: 'slider',
98
+ validator: FormBuilderValidators.compose([
99
+ FormBuilderValidators.min(context, 6),
100
+ ]),
101
+ onChanged: _onChanged,
102
+ min: 0.0,
103
+ max: 10.0,
104
+ initialValue: 7.0,
105
+ divisions: 20,
106
+ activeColor: Colors.red,
107
+ inactiveColor: Colors.pink[100],
108
+ decoration: const InputDecoration(
109
+ labelText: 'Number of things',
130
110
),
131
111
),
132
- validator: FormBuilderValidators.equal(
133
- context,
134
- true,
135
- errorText:
136
- 'You must accept terms and conditions to continue',
112
+ FormBuilderCheckbox(
113
+ name: 'accept_terms',
114
+ initialValue: false,
115
+ onChanged: _onChanged,
116
+ title: RichText(
117
+ text: const TextSpan(
118
+ children: [
119
+ TextSpan(
120
+ text: 'I have read and agree to the ',
121
+ style: TextStyle(color: Colors.black),
122
+ ),
123
+ TextSpan(
124
+ text: 'Terms and Conditions',
125
+ style: TextStyle(color: Colors.blue),
126
+ ),
127
+ ],
128
+ ),
129
+ ),
130
+ validator: FormBuilderValidators.equal(
131
+ context,
132
+ true,
133
+ errorText: 'You must accept terms and conditions to continue',
134
+ ),
137
135
),
138
- ),
139
- FormBuilderTextField(
140
- name: 'age',
141
- decoration: InputDecoration(
142
- labelText:
143
- 'This value is passed along to the [Text.maxLines] attribute of the [Text] widget used to display the hint text.',
136
+ FormBuilderTextField(
137
+ name: 'age',
138
+ decoration: const InputDecoration(
139
+ labelText:
140
+ 'This value is passed along to the [Text.maxLines] attribute of the [Text] widget used to display the hint text.',
141
+ ),
142
+ onChanged: _onChanged,
143
+ // valueTransformer: (text) => num.tryParse(text),
144
+ validator: FormBuilderValidators.compose([
145
+ FormBuilderValidators.required(context),
146
+ FormBuilderValidators.numeric(context),
147
+ FormBuilderValidators.max(context, 70),
148
+ ]),
149
+ keyboardType: TextInputType.number,
144
150
),
145
- onChanged: _onChanged,
146
- // valueTransformer: (text) => num.tryParse(text),
147
- validator: FormBuilderValidators.compose([
148
- FormBuilderValidators.required(context),
149
- FormBuilderValidators.numeric(context),
150
- FormBuilderValidators.max(context, 70),
151
- ]),
152
- keyboardType: TextInputType.number,
153
- ),
154
- FormBuilderDropdown(
155
- name: 'gender',
156
- decoration: InputDecoration(
157
- labelText: 'Gender',
151
+ FormBuilderDropdown(
152
+ name: 'gender',
153
+ decoration: const InputDecoration(
154
+ labelText: 'Gender',
155
+ ),
156
+ // initialValue: 'Male',
157
+ allowClear: true,
158
+ hint: const Text('Select Gender'),
159
+ validator: FormBuilderValidators.compose(
160
+ [FormBuilderValidators.required(context)]),
161
+ items: genderOptions
162
+ .map((gender) => DropdownMenuItem(
163
+ value: gender,
164
+ child: Text('$gender'),
165
+ ))
166
+ .toList(),
158
167
),
159
- // initialValue: 'Male',
160
- allowClear: true,
161
- hint: Text('Select Gender'),
162
- validator: FormBuilderValidators.compose(
163
- [FormBuilderValidators.required(context)]),
164
- items: genderOptions
165
- .map((gender) => DropdownMenuItem(
166
- value: gender,
167
- child: Text('$gender'),
168
- ))
169
- .toList(),
170
- ),
171
- ],
168
+ ],
169
+ ),
172
170
),
173
- ),
174
- Row(
175
- children: <Widget>[
176
- Expanded(
177
- child: MaterialButton(
178
- color: Theme.of(context).colorScheme.secondary,
179
- child: Text(
180
- "Submit",
181
- style: TextStyle(color: Colors.white),
171
+ Row(
172
+ children: <Widget>[
173
+ Expanded(
174
+ child: MaterialButton(
175
+ color: Theme.of(context).colorScheme.secondary,
176
+ child: const Text(
177
+ "Submit",
178
+ style: TextStyle(color: Colors.white),
179
+ ),
180
+ onPressed: () {
181
+ _formKey.currentState!.save();
182
+ if (_formKey.currentState!.validate()) {
183
+ print(_formKey.currentState!.value);
184
+ } else {
185
+ print("validation failed");
186
+ }
187
+ },
182
188
),
183
- onPressed: () {
184
- _formKey.currentState.save();
185
- if (_formKey.currentState.validate()) {
186
- print(_formKey.currentState.value);
187
- } else {
188
- print("validation failed");
189
- }
190
- },
191
189
),
192
- ),
193
- SizedBox(width: 20),
194
- Expanded(
195
- child: MaterialButton(
196
- color: Theme.of(context).colorScheme.secondary,
197
- child: Text(
198
- "Reset",
199
- style: TextStyle(color: Colors.white),
190
+ const SizedBox(width: 20),
191
+ Expanded(
192
+ child: MaterialButton(
193
+ color: Theme.of(context).colorScheme.secondary,
194
+ child: const Text(
195
+ "Reset",
196
+ style: TextStyle(color: Colors.white),
197
+ ),
198
+ onPressed: () {
199
+ _formKey.currentState!.reset();
200
+ },
200
201
),
201
- onPressed: () {
202
- _formKey.currentState.reset();
203
- },
204
202
),
205
- ),
206
- ],
207
- )
208
- ],
209
- );
210
- }
203
+ ],
204
+ )
205
+ ],
206
+ );
207
+ }
211
208
```
212
209
213
210
## Input widgets
0 commit comments