Содержимое центральной строки или перенос, если он слишком длинный - PullRequest
0 голосов
/ 02 июня 2019

У меня есть Row с Icon и Text. Я хочу, чтобы содержимое Row было центрировано, то есть Icon + Text должно быть центрировано, а Icon слева от Text. Я делаю это, устанавливая mainAxisAlignment: MainAxisAlignment.center на Row.

Проблема в том, что иногда содержимое Text слишком длинное, чтобы поместиться в одну строку, и его необходимо обернуть. Я могу сделать это, обернув его в Expanded, но это также имеет побочный эффект: Text занимает весь Row, так что теперь Icon и Text станут настраиваться влево вместо по центру Row, даже если текстовое содержимое короткое.

Row(
    mainAxisSize: MainAxisSize.min,
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
        Icon(Icons.info_outline, color: Colors.grey),
        Expanded(
          child: Text(
              'Short text' // or 'Some very long text that won\'t fit one one line here'
          ),
        ),
    ],
)

Как мне добиться того, чего я хочу - то есть центрировать содержимое Row, при этом оставляя Text перенос, если текст слишком длинный, чтобы поместиться в одну строку?

1 Ответ

0 голосов
/ 02 июня 2019

Если ваш Row обернут Center. Попробуйте это.

Center(
    child: Row(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
            Icon(Icons.info_outline, color: Colors.grey),
            Flexible(
                child: Text('Hello World'),
            ),
        ],
    ),
)

Измените Expanded на Flexible

...