Skip to content

Commit bc33f52

Browse files
freemansoftfreemansoft
committed
re-using wrapSpacing for in-item padding was a bad idea
1 parent 504d9a3 commit bc33f52

File tree

3 files changed

+50
-39
lines changed

3 files changed

+50
-39
lines changed

‎example/lib/sources/decorated_radio_checkbox.dart

Lines changed: 50 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
2323
const SizedBox(height: 20),
2424
// this text appears correctly if the textScaler <> 1.0
2525
const Text(
26-
'With itemDecoration- label is a column of Widgets - orientation: wrap - wrapSpacing 5.0',
26+
'label:column of Widgets itemBorder:true orient:wrap wrapSpacing:5.0',
2727
textScaler: TextScaler.linear(1.01)),
2828
FormBuilderCheckboxGroup(
2929
name: 'aCheckboxGroup1',
@@ -36,7 +36,7 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
3636
),
3737
const SizedBox(height: 20),
3838
const Text(
39-
'With itemDecoration - label is a column of Widgets - orientation: wrap - wrapSpacing 5.0',
39+
'label:column of Widgets itemBorder:true orient:wrap wrapSpacing:5.0',
4040
textScaler: TextScaler.linear(1.01)),
4141
FormBuilderCheckboxGroup(
4242
name: 'aCheckboxGroup2',
@@ -50,7 +50,7 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
5050
),
5151
const SizedBox(height: 20),
5252
const Text(
53-
'With itemDecoration - label is a column of Widgets - orientation: wrap - wrapSpacing 5.0',
53+
'label:column of Widgets itemBorder:true orient:wrap wrapSpacing: 5.0',
5454
textScaler: TextScaler.linear(1.01)),
5555
FormBuilderRadioGroup(
5656
name: 'aRadioGroup1',
@@ -62,8 +62,7 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
6262
borderRadius: BorderRadius.circular(5.0)),
6363
),
6464
const SizedBox(height: 20),
65-
const Text(
66-
'With itemDecoration - label is the value - orientation: wrap - wrapSpacing 10.0',
65+
const Text('label:value itemBorder:true orient:wrap wrapSpacing:10.0',
6766
textScaler: TextScaler.linear(1.01)),
6867
FormBuilderRadioGroup(
6968
name: 'aRadioGroup2',
@@ -83,16 +82,15 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
8382
),
8483
const SizedBox(height: 20),
8584
const Text(
86-
'No itemDecoration - label is the value - orientation: wrap - wrapSpacing 10.0',
85+
'itemDecoration:false label:value orient:wrap wrapSpacing:10.0',
8786
textScaler: TextScaler.linear(1.01)),
8887
FormBuilderRadioGroup(
8988
name: 'aRadioGroup3',
9089
options: getDemoOptions(),
9190
wrapSpacing: 10.0,
9291
),
9392
const SizedBox(height: 20),
94-
const Text(
95-
'With itemDecoration - orientation: horiz - no border - wrapSpacing 5.0',
93+
const Text('orient:horiz itemBorder:false wrapSpacing:5.0',
9694
textScaler: TextScaler.linear(1.01)),
9795
FormBuilderCheckboxGroup(
9896
name: 'aCheckboxGroup3',
@@ -105,8 +103,7 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
105103
borderRadius: BorderRadius.circular(5.0)),
106104
),
107105
const SizedBox(height: 20),
108-
const Text(
109-
'With itemDecoration - orientation: vert - with border - wrapSpacing 5.0',
106+
const Text('orient:vert itemBorder:true wrapSpacing:5.0',
110107
textScaler: TextScaler.linear(1.01)),
111108
FormBuilderCheckboxGroup(
112109
name: 'aCheckboxGroup3',
@@ -120,11 +117,11 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
120117
),
121118
const SizedBox(height: 20),
122119
const Text(
123-
'With itemDecoration - orientation: vert - with border - wrapSpacing 5.0',
120+
'label:w/sizebox orient:vert itemBorder:true wrapSpacing:5.0',
124121
textScaler: TextScaler.linear(1.01)),
125122
FormBuilderRadioGroup(
126123
name: 'aRadioGroup4',
127-
options: getDemoOptionsWidgets(),
124+
options: getDemoOptionsWidgets(forceMinWidth: 80.0),
128125
wrapSpacing: 5.0,
129126
orientation: OptionsOrientation.vertical,
130127
itemDecoration: BoxDecoration(
@@ -138,24 +135,51 @@ class _DecoratedRadioCheckboxState extends State<DecoratedRadioCheckbox> {
138135
}
139136

140137
/// options using column of widgets for the label
141-
List<FormBuilderFieldOption> getDemoOptionsWidgets() {
142-
return const [
138+
/// We can force a min width by creating a sized box so we don't need another parameter
139+
List<FormBuilderFieldOption> getDemoOptionsWidgets({forceMinWidth = 0.0}) {
140+
return [
143141
FormBuilderFieldOption(
144-
value: "airplane",
145-
child: Column(
146-
children: [Text("Airplane"), Icon(Icons.airplanemode_on)],
147-
)),
142+
value: "airplane",
143+
child: Container(
144+
padding: const EdgeInsets.all(5.0),
145+
child: Column(
146+
children: [
147+
const Text("Airplane"),
148+
const Icon(Icons.airplanemode_on),
149+
SizedBox(width: forceMinWidth, height: 0.0),
150+
],
151+
)),
152+
),
148153
FormBuilderFieldOption(
149-
value: "fire-truck",
150-
child:
151-
Column(children: [Text("Fire Truck"), Icon(Icons.fire_truck)])),
154+
value: "fire-truck",
155+
child: Container(
156+
padding: const EdgeInsets.all(5.0),
157+
child: Column(children: [
158+
const Text("Fire Truck"),
159+
const Icon(Icons.fire_truck),
160+
SizedBox(width: forceMinWidth, height: 0.0),
161+
])),
162+
),
152163
FormBuilderFieldOption(
153-
value: "bus-alert",
154-
child: Column(children: [Text("Bus Alert"), Icon(Icons.bus_alert)])),
164+
value: "bus-alert",
165+
child: Container(
166+
padding: const EdgeInsets.all(5.0),
167+
child: Column(children: [
168+
const Text("Bus Alert"),
169+
const Icon(Icons.bus_alert),
170+
SizedBox(width: forceMinWidth, height: 0.0),
171+
])),
172+
),
155173
FormBuilderFieldOption(
156-
value: "firetruck",
157-
child:
158-
Column(children: [Text("Motorcycle"), Icon(Icons.motorcycle)])),
174+
value: "firetruck",
175+
child: Container(
176+
padding: const EdgeInsets.all(5.0),
177+
child: Column(children: [
178+
const Text("Motorcycle"),
179+
const Icon(Icons.motorcycle),
180+
SizedBox(width: forceMinWidth, height: 0.0),
181+
])),
182+
),
159183
];
160184
}
161185

‎lib/src/widgets/grouped_checkbox.dart

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,6 @@ class GroupedCheckbox<T> extends StatelessWidget {
182182
final ControlAffinity controlAffinity;
183183

184184
/// A BoxDecoration that is added to each item if provided
185-
/// [wrapSpacing] is reused for the the padding inside the [itemDecoration].
186185
/// [wrapSpacing] is used as inter-item bottom margin for [Orientation.vertical]
187186
/// [wrapSpacing] is used as inter-item right margin for [Orientation.horizontal].
188187
/// on the side opposite from the control
@@ -309,10 +308,6 @@ class GroupedCheckbox<T> extends StatelessWidget {
309308
if (this.itemDecoration != null) {
310309
compositeItem = Container(
311310
decoration: this.itemDecoration,
312-
padding: EdgeInsets.only(
313-
left: controlAffinity == ControlAffinity.leading ? 0.0 : wrapSpacing,
314-
right: controlAffinity == ControlAffinity.leading ? wrapSpacing : 0.0,
315-
),
316311
margin: EdgeInsets.only(
317312
bottom:
318313
orientation == OptionsOrientation.vertical ? wrapSpacing : 0.0,

‎lib/src/widgets/grouped_radio.dart

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -173,7 +173,6 @@ class GroupedRadio<T> extends StatefulWidget {
173173
final ControlAffinity controlAffinity;
174174

175175
/// A BoxDecoration that is added to each item if provided
176-
/// [wrapSpacing] is reused for the the padding inside the [itemDecoration].
177176
/// [wrapSpacing] is used as inter-item bottom margin for [Orientation.vertical]
178177
/// [wrapSpacing] is used as inter-item right margin for [Orientation.horizontal].
179178
/// on the side opposite from the control
@@ -301,13 +300,6 @@ class _GroupedRadioState<T> extends State<GroupedRadio<T?>> {
301300
if (widget.itemDecoration != null) {
302301
compositeItem = Container(
303302
decoration: widget.itemDecoration,
304-
padding: EdgeInsets.only(
305-
left: widget.controlAffinity == ControlAffinity.leading
306-
? 0.0
307-
: widget.wrapSpacing,
308-
right: widget.controlAffinity == ControlAffinity.leading
309-
? widget.wrapSpacing
310-
: 0.0),
311303
margin: EdgeInsets.only(
312304
bottom: widget.orientation == OptionsOrientation.vertical
313305
? widget.wrapSpacing

0 commit comments

Comments
 (0)