如何对齐 Flutter 中不同文本小部件中的文本？

Question

When I using Text('00:47') , the colon in the middle can be centered vertically with the number, as shown below:

But when I combine three Text widgets, the colon loses its alignment.

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Text('00'),
    Text(':'),
    Text('47'),
  ],
)

How can I make the colon and number vertically centered?

Answer 1

You can try this

  Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
      Text('00'),
      Padding(
        padding: const EdgeInsets.only(bottom: 10),
        child: Text(':'),
      ),
      Text('47'),
    ],
  )