如何生成 Flutter 文本字段,在提供建议的情况下为不正确的单词加下划线?

问题描述

一张图胜过一千个字,让我告诉你我试图实现的目标:

enter image description here

解决方案可能是使用 Flutter 内置小部件或第三方小部件。

有人吗?

解决方法

您可以使用 Text.rich() 方法(或 RichText Widget)来实现您想要的。
以下代码段对应于您的屏幕截图。

  return Scaffold(
      body: Center(
        child: Text.rich(
          TextSpan(
            text: 'I lost ',style: TextStyle(fontSize: 24),children: <TextSpan>[
              TextSpan(
                  text: 'Password.',style: TextStyle(
                    decoration: TextDecoration.underline,)),TextSpan(
                  text: ' ',),TextSpan(
                  text: 'What do?',// can add more TextSpans here...
            ],);

enter image description here