Skip to content

Commit 12a6d10

Browse files
authored
migrate form builder readme code to nullsafety (#988)
1 parent bb84f80 commit 12a6d10

File tree

1 file changed

+163
-166
lines changed

1 file changed

+163
-166
lines changed

packages/flutter_form_builder/README.md

Lines changed: 163 additions & 166 deletions
Original file line numberDiff line numberDiff line change
@@ -28,186 +28,183 @@ final _formKey = GlobalKey<FormBuilderState>();
2828
...
2929
3030
@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+
],
6155
),
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+
],
8172
),
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,
9683
),
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+
),
11295
),
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',
130110
),
131111
),
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+
),
137135
),
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,
144150
),
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(),
158167
),
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+
),
172170
),
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+
},
182188
),
183-
onPressed: () {
184-
_formKey.currentState.save();
185-
if (_formKey.currentState.validate()) {
186-
print(_formKey.currentState.value);
187-
} else {
188-
print("validation failed");
189-
}
190-
},
191189
),
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+
},
200201
),
201-
onPressed: () {
202-
_formKey.currentState.reset();
203-
},
204202
),
205-
),
206-
],
207-
)
208-
],
209-
);
210-
}
203+
],
204+
)
205+
],
206+
);
207+
}
211208
```
212209

213210
## Input widgets

0 commit comments

Comments
 (0)