自动检测链接抖动

Question

我有一个关于文本小部件无法检测到是否存在链接的问题。

稍后我将从服务器收到文本响应，如图所示。回复采用文本和链接的形式。

问题是 flutter 上的文本小部件无法检测到它。如何使文本中的链接可检测且可点击？

我已阅读并搜索过此内容，但找不到。因为大部分链接文本必须由您自己输入。虽然我的问题是文本自动出现在那里，因为它是来自服务器的响应

谁能帮我找到答案？ 先谢谢你了

Answer 1

文本小部件不会自动识别链接。

但是，您可以使用 TextSpan 小部件和 url_launcher 将操作插入文本，有点像这样：

RichText(
    text: TextSpan(
        children: [
            TextSpan(text: 'some text'),
            TextSpan(
                text: url,
                style: new TextStyle(
                    color: Colors.blue,
                    decoration: TextDecoration.underline
                ),
                recognizer: TapGestureRecognizer()
                ..onTap = () async {
                    if (await canLaunch(url)) {
                      await launch(url);
                    } else {
                      throw 'Could not launch $url';
                    }
                },
            ),
        ]
    ),
)

您可以将其包装到一个类中并为自己制作一个小型 LinkText 小部件。

flutter_linkify 的作用是自动检测文本中的 URL 和电子邮件 ID 并链接它们。 您也可以使用正则表达式来执行此操作。例如。为了识别 url，你可以有类似的东西：

 bool _isLink(String input) {
     final matcher = new RegExp(
        r"(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)");
    return matcher.hasMatch(input);
}

您必须稍微修改一下以获取子字符串并将其用作文本范围中的 url！

Answer 2

我只是想再添加一个解决方案，您可以使用 flutter_linkify 包来完成：

允许将文本 URL 和电子邮件地址转换为 Flutter 应用程序中可点击的内联链接。

Linkify(
              text:
                  "This is the URL to my profile: https://stackoverflow.com/users/19269162/pratik-lakhani",
              onOpen: (link) async {
                if (!await launchUrl(Uri.parse(link.url))) {
                  throw Exception('Could not launch ${link.url}');
                }
              },
              linkStyle: TextStyle(fontSize: 25),
              style: TextStyle(fontSize: 25),
            ),

示例：