class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'Flutter Demo'
),
),
body: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text(
'Hell World!'
)
],
)
);
}
}
Why the text Hell World
only centering horizontally and not vertically as I have also specified CrossAxisAligment
.
Is it because of this : Issue
crossAxisAlignment: The crossAxisAlignment takes in CrossAxisAlignment enum as the object to how the children's widgets should be places in crossAxisAlignment. For Row it is vertical and for Column it is horizontal. direction: This property holds as the Axis enum object to decide the direction used in the main axis.
Using mainAxisAlignment in a Row lets you align the row's children horizontally (e.g. left, right). The cross axis to a Row 's main axis is vertical. So using crossAxisAlignment in a Row lets you define, how its children are aligned vertically.
Row
don't take all the vertical space available by default. It takes only the needed space (but it takes all the horizontal space).
Forcing the row to expend vertically should do the trick:
body: SizedBox.expand(
child: Row(...),
),
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With