Home > database >  Widget layout within container
Widget layout within container

Time:11-12

example

Hey, so I am trying to format these text widgets inside this green bubble. For some reason there is a huge space in between '45' and 'lbs'. I am not sure why this is. I would like the space to be consistent between all the text children in the column. Any feedback is appreciated.

return Container(
      decoration: bubbleBoxDecoration,
      height: bubbleDiameter.toDouble(),
      width: bubbleDiameter.toDouble(),
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Upper Body',
              style: labelTextStyle,
            ),

            Text(
              '45',
              style: weightTextStyle,
            ),
            Text(
              'lbs',
              style: unitTextStyle,
            ),

CodePudding user response:

You can try using

MainAxisAlignment.spaceBetween

on your Column, for achieving consistent spaces between them

CodePudding user response:

I needed to adjust the height of the text. There was some "invisible" height on the 45 that needed adjustment.

  • Related