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

Question

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

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

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

滴滴的文字应该从""下面开始。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,
        ),
      ),
    )
  ],
)

Answer 1

使用 Text.rich 与 WidgetSpan 将图标放在文本内（内联）。

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.',
      )
    ],
  ),
)