I want to center a Text vertically in the bottom:
Sektion of my AppBar
.
Some things I allready tried are:
1. wrap the Text in a Center(...)
Widget
2. wrap the Text in a Column(...)
and use crossAxisAlignment: CrossAxisAlignment.center
The bottom:
Sektion is a PreferredSizeWidget and does not provide anything to format a Widget.
appBar: new AppBar(
actions: <Widget>[
IconButton(
icon: Icon(Icons.settings),
onPressed: () {
print("Settings Icon");
},
),
],
bottom: PreferredSize(
preferredSize: Size(130.0, 130.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new Text(
'N/A',
),
],
),
),
),
I have have found this issue here: https://github.com/flutter/flutter/issues/16262 where the Text was centered but the reproduce code did not worked out for me.
The Text should me somewhere like the red line is (see Image)
Thank you!
The solution is to place a Container as the only children in the ListView , and give it a minimum height equal to the available space for the height (Use LayoutBuilder to measure the maximum height for the widget). Then as the Container 's child, you can either place a Center or Column (with MainAxisAlignment.
How do I center Text in a container in flutter? Flutter – Center Align Text in Text Widget To center align the text in a Text widget, provide textAlign property with value TextAlign. center .
PreferredSizeWidget
does not impose a size constraint on its child, so you must wrap the Column
in a widget with defined height in order to add alignment.
Also, mainAxisAlignment
should be used, since this is the vertical alignment in a Column
.
bottom: PreferredSize(
preferredSize: Size(130.0, 130.0),
child: Container(
height: 130,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
'N/A',
),
],
),
),
)
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