I am trying to have text centered inside a container. No matter what I did, text is never centered. Here is my code:
Container(
alignment: Alignment.center,
width: 47,
height: 47,
decoration: BoxDecoration(color: Colors.grey, shape: BoxShape.circle),
child: Text(
firstName == null && lastName == null
? 'UU'
: '${firstName[0]}${lastName[0]}'.toUpperCase(),
style: TextStyle(
fontFamily: 'AvenirLTStd-Roman',
fontSize: 18,
color: Colors.white,
fontWeight: FontWeight.w300,
),
textAlign: TextAlign.center,
),
)
And this is how the screen is generated:
If you notice text is not centered, the bottom part of the container seems to have more "free space" compared to the top. When I open this in widget inspector and highlight Text Widget I see this:
Does anyone know what am I missing here and why is text not centered? I want text to be in the middle of the container and have equal space between top and bottom.
UPDATE:
Using Center widget does not help:
Try to wrap your Container with Center. Center -> Container
Wrap the text with Center(). This might be works.
Simply do this
Container(
alignment: Alignment.center,
width: 47,
height: 47,
decoration: BoxDecoration(color: Colors.grey, shape: BoxShape.circle),
child: Center(child: Text(
firstName == null && lastName == null
? 'UU'
: '${firstName[0]}${lastName[0]}'.toUpperCase(),
style: TextStyle(
fontFamily: 'AvenirLTStd-Roman',
fontSize: 18,
color: Colors.white,
fontWeight: FontWeight.w300,
),
textAlign: TextAlign.center,
),),
)
Try to
Container(
alignment: Alignment.center,
width: 47,
height: 47,
decoration: BoxDecoration(color: Colors.grey, shape: BoxShape.circle),
child: Center(child: Text(
firstName == null && lastName == null
? 'UU'
: '${firstName[0]}${lastName[0]}'.toUpperCase(),
style: TextStyle(
fontFamily: 'AvenirLTStd-Roman',
fontSize: 18,
color: Colors.white,
fontWeight: FontWeight.w300,
),
textAlign: TextAlign.center,
),),
)
Please remove or change fontFamily it will fix it.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.