Code:
new Container(
alignment: FractionalOffset.center,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
Removing Space-:
new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
GestureDetector(
child: new Text('Don\'t have an account?',
style: new TextStyle(color: Color(0xFF2E3233))),
onTap: () {},
),
GestureDetector(
onTap: (){},
child: new Text(
'Register.',
style: new TextStyle(
color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),
))
],
),
OR
GestureDetector(
onTap: (){},
child: new Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text('Don\'t have an account?',
style: new TextStyle(color: Color(0xFF2E3233))),
new Text(
'Register.',
style: new TextStyle(
color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),
)
],
),
),
You can use Spacers if all you want is a little bit of spacing between items in a row. The example below centers 2 Text widgets within a row with some spacing between them.
Spacer creates an adjustable, empty spacer that can be used to tune the spacing between widgets in a Flex
container, like Row
or Column
.
In a row
, if we want to put space between two widgets such that it occupies all remaining space.
widget = Row (
children: <Widget>[
Spacer(flex: 20),
Text(
"Item #1",
),
Spacer(), // Defaults to flex: 1
Text(
"Item #2",
),
Spacer(flex: 20),
]
);