Flutter - 如何在一行中显示文字和图标?

问题描述 投票:0回答:1

我正在使用行小部件与三个子小部件:TextIconText。

我希望所有的文字都能以同一水平线的单行出现,如果文字增加,则下降到新的行。

我对行部件使用了以下代码,但最后一个文本部件没有正确对齐。enter image description here

滴滴的文字应该从""下面开始。Tap"和"on the right hand"没有对齐

Row(
  mainAxisAlignment: MainAxisAlignment.start,
  mainAxisSize: MainAxisSize.min,
  children: <Widget>[
    Text(
      'Tap ',
      style: TextStyle(
        fontSize: 17,
      ),
    ),
    Icon(Icons.add),
    Expanded(
      child: Text(
        'on the right hand corner to start a new chat.',
        style: TextStyle(
          fontSize: 17,
        ),
      ),
    )
  ],
)
flutter flutter-layout
1个回答
1
投票

使用 Text.richWidgetSpan 将图标放在文本内(内联)。

Text.rich(
  TextSpan(
    style: TextStyle(
      fontSize: 17,
    ),
    children: [
      TextSpan(
        text: 'Tap',
      ),
      WidgetSpan(
        child: Icon(Icons.add),
      ),
      TextSpan(
        text: 'on the right hand corner to start a new chat.',
      )
    ],
  ),
)
© www.soinside.com 2019 - 2024. All rights reserved.