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

Bil*_*bbi 4 flutter flutter-layout

我正在使用带有三个子小部件的行小部件:文本图标文本

我希望所有这些都水平出现在同一级别的单行中,如果文本增加,则下降到新行。

我正在为 Row 小部件使用以下代码,但最后一个 Text 小部件未正确对齐 在此处输入图片说明

文本放置应从“ 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,
        ),
      ),
    )
  ],
)
Run Code Online (Sandbox Code Playgroud)

Pav*_*vel 7

使用Text.richwithWidgetSpan将图标放在文本中(内联)

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.',
      )
    ],
  ),
)
Run Code Online (Sandbox Code Playgroud)