The "Row" widget in Flutter is a multi-purpose layout widget that is used to display its children in a horizontal fashion. It is similar to the Flex widget but with a default direction of Axis.horizontal.
The Row widget takes several properties, including:
- children: a list of widgets that are placed inside the Row.
- mainAxisAlignment: the alignment of the children along the main axis. It can be one of MainAxisAlignment.start, MainAxisAlignment.end, MainAxisAlignment.center, MainAxisAlignment.spaceBetween, MainAxisAlignment.spaceAround, or MainAxisAlignment.spaceEvenly.
- crossAxisAlignment: the alignment of the children along the cross axis. It can be one of CrossAxisAlignment.start, CrossAxisAlignment.end, CrossAxisAlignment.center, CrossAxisAlignment.stretch, or CrossAxisAlignment.baseline.
- mainAxisSize: the size of the main axis. It can be MainAxisSize.max or MainAxisSize.min.
Here is an example of how to use the Row widget to align three buttons horizontally, with equal space between them:
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
FlatButton(
onPressed: () {},
child: Text('Button 1'),
),
FlatButton(
onPressed: () {},
child: Text('Button 2'),
),
FlatButton(
onPressed: () {},
child: Text('Button 3'),
),
],
)
It's worth noting that Row widget is simpler to use than Flex when you want to align widgets horizontally, but it doesn't have the same flexibility. It's recommended to use Flex when you need to change the direction, or need more advanced layout features.
Video Link: