I create many Row
items that contain inside of a Column
and want to make spacing between each row items. I tried to set with mainAxisAlignment
of Column
. But nothing changes between each Row
items. How to change or which widget I need to use for that?
Column(
children: [
Row(
children: [
Flexible(
flex: 2,
fit: FlexFit.tight,
child: Container(child: kTextFieldLabelText('Name:')),
),
Flexible(
flex: 6,
fit: FlexFit.loose,
child: Container(
//width: 100,
child: TextFormField(
decoration:
kTextFormFieldsDecoration('Enter your name'),
maxLines: 1,
),
),
),
],
),
Row(
children: [
Flexible(
flex: 2,
fit: FlexFit.tight,
child: Container(child: kTextFieldLabelText('Name:')),
),
Flexible(
flex: 6,
fit: FlexFit.loose,
child: Container(
//width: 100,
child: TextFormField(
decoration:
kTextFormFieldsDecoration('Enter your name'),
maxLines: 1,
),
),
),
],
),
Row(
children: [
Flexible(
flex: 2,
fit: FlexFit.tight,
child: Container(child: kTextFieldLabelText('Name:')),
),
Flexible(
flex: 6,
fit: FlexFit.loose,
child: Container(
//width: 100,
child: TextFormField(
decoration:
kTextFormFieldsDecoration('Enter your name'),
maxLines: 1,
),
),
),
],
),
],
),
CodePudding user response:
you can use also
Spacer(), or Spacer(flex: 1),
or use sized box determine your preferred height and width
SizedBox(height: // put here,),
and also sized box have other things like
SizedBox.expand(),
either ways play with it
CodePudding user response:
If the children
of the Row
are of fixed size then you can use MainAxisAlignment
for Row
in order to arrange them accordingly.
Else if you have widgets
that are Flexible
then you may need to add a SizedBox
with the required width
between two widgets.
CodePudding user response:
You can use SizedBox
Widget and set height or width to spacing vertical or horizontal between your Rows.