Flutter:如何在 RichText 中显示 TextSpan 的工具提示

Question

我有大段，很多词都必须有工具提示信息。当您单击这些单词中的任何一个时，应该会出现工具提示消息。
我尝试使用 RichText 小部件，其中包含许多 TextSpan children 喜欢以下:

RichText(
  text: TextSpan(
     children: <TextSpan>[
        TextSpan(text: "Welcome to"),
        TextSpan(text: "Flutter"),
        ... 
     ]),
),

我需要在单击 TextSpan 时显示工具提示文本
我试图包装 TextSpan与 Tooltip小部件

RichText(
  text: TextSpan(
     children: <TextSpan>[
        TextSpan(text: "Welcome to"),
        ...
        Tooltip(
            message: "any text here",
            child: TextSpan(text: "Flutter"),
        ),
        ...            
     ]),
),

但这是不可能的，因为 children 必须是 TextSpan只要。
任何人都知道如何实现这一要求？

Answer 1

与 文本跨度 您有两种方法可以做到: 使用或不使用 children范围。

Widget _toolTipSimple() {
    return Center(
      child: Tooltip(
        message: "Flutter",
        child: RichText(
          text: TextSpan(
              text: "Welcome to", style: TextStyle(fontSize: 70)),
        ),
      ),
   );
}

这是一个没有 的复杂版本工具提示 但它处理对特定单词的点击:

Widget _snackBarTextSpanChildren(BuildContext context) {
    return Center(
      child: RichText(
        textAlign: TextAlign.center,
        text: TextSpan(
          children: [
            TextSpan(text: "Welcome to ", style: TextStyle(fontSize: 70)),
            TextSpan(
                text: "Flutter",
                style: TextStyle(fontSize: 70),
                recognizer: TapGestureRecognizer()..onTap = () {
                  Scaffold.of(context).showSnackBar(SnackBar(content: Text('Hello!')));
                }),
          ],
        ),
      ),
    );
  }

这个结果如下: