Flutter：从文本小部件中获取单个单词

Posted 2023-03-06

【中文标题】Flutter：从文本小部件中获取单个单词

【英文标题】：Flutter : getting single word from Text Widget

【发布时间】：2019-06-13 09:57:20

【问题描述】：

我正在尝试使用 Flutter 开发一个应用程序，向用户显示单个单词的翻译。因此，如果用户想要一个单词的翻译，那么他应该双击该单词并显示他/她的翻译。

在这里，我只是不想获得Text 小部件的String 值，但我也想获得用户双击的单词。那么有没有办法做到这一点？

【问题讨论】：

所选文本的图像示例将有助于澄清。

【参考方案1】：

您可以使用RichText 完成此操作。在我的示例中，如果您双击任何突出显示的单词，它将被打印出来。

Widget build(BuildContext context) 
  final testString = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.';
  final textSpans = <TextSpan>[];

  testString.splitMapJoin(
    RegExp('\\w+'), 
    onMatch: (m) 
      final matchStr = m.group(0);

      textSpans.add(TextSpan(
        recognizer: DoubleTapGestureRecognizer()..onDoubleTap = () => print(matchStr),
        text: matchStr,
        style: TextStyle(background: Paint()..color = Colors.blue.withOpacity(0.4))
      ));
      return matchStr;
    ,
    onNonMatch: (string) 
      textSpans.add(TextSpan(
        text: string,
      ));
      return string;
    ,
  );

  return RichText(
    text: TextSpan(
      style: TextStyle(fontSize: 30),
      children: textSpans,
    ),
  );