The Row
widget in Flutter is used to display widgets in a horizontal manner and is part of the Flex
layout. Some of the common properties of the Row
widget are:
mainAxisAlignment
: This property sets the horizontal alignment of the children within theRow
widget. Possible values areMainAxisAlignment.start
,MainAxisAlignment.end
,MainAxisAlignment.center
,MainAxisAlignment.spaceBetween
, andMainAxisAlignment.spaceAround
.crossAxisAlignment
: This property sets the vertical alignment of the children within theRow
. Possible values areCrossAxisAlignment.start
,CrossAxisAlignment.end
,CrossAxisAlignment.center
, andCrossAxisAlignment.stretch
.children
: This property takes a list of widgets that will be displayed in theRow
.textDirection
: This property sets the direction in which the text in theRow
should be displayed. Possible values areTextDirection.ltr
(left to right) andTextDirection.rtl
(right to left).
Here’s an example of how to use the Row
widget with some of its properties:
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(Icons.star),
Text('Star'),
SizedBox(width: 10),
Icon(Icons.star),
Text('Star'),
SizedBox(width: 10),
Icon(Icons.star),
Text('Star'),
],
)
In this example, the mainAxisAlignment
is set to MainAxisAlignment.spaceBetween
which will distribute the space between the children evenly. The crossAxisAlignment
is set to CrossAxisAlignment.center
which will center the children vertically.