Как во Flutter выровнять текст в строке по высоте?

Question

Как во Flutter выровнять текст в строке по высоте? На нижеприведенной картинке видно, что второй текст выше чем первый.

Если установить параметры: crossAxisAlignment: CrossAxisAlignment.baseline То выровняться по низу. А вот как выровнять по верху?

Answer 1

Проблема по-простому в том, что есть высота самого текста, а есть высота линии:

Для подобных случаев с текстом есть специальный виджет Baseline:

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Text(
      '00',
      style: TextStyle(
        fontSize: 70,
        fontWeight: FontWeight.bold,
      ),
    ),
    Baseline(
      baseline: 0,
      baselineType: TextBaseline.ideographic,
      child: Text(
        '00',
        style: TextStyle(
          fontSize: 30,
          fontWeight: FontWeight.bold,
        ),
      ),
    ),
  ],
)

Результат:

P.S. Всегда старайтесь избегать хардкод решения симптомов проблемы.

БЛОГ НА HUSL

Как во Flutter выровнять текст в строке по высоте?

Ответы (1 шт):