一、需求来源

在实际项目中。IM 聊天模块经常需要自动识别并跳转各种链接、邮箱地址，甚至是自定义域名。使用者在聊天时往往会长按文字进行复制或全选。但默认的 SelectableText 长按菜单不够灵活，无法满足业务定制需求。

从痛点来看。

• 链接与邮箱识别不完整，手动写正则太麻烦。
• 长按后默认菜单缺少“搜索”“取消”等操作。
• 不同网站上长按菜单样式不统一。不过，
• 想要支持自定义点击事件。

二、使用示例

通过封装 RichTextExt.createTextSpansByRegExp 可以一次性完成链接和邮箱的识别与高亮；怎么说呢，结合 SelectableText.rich 实现长按选择文字。并自定义长按菜单，

final String autoLinkText = '''如需帮助，请访问官网 https://flutter.dev 或发送邮件至。也可浏览 www.github.com/flutter 了解项目动态，联系邮箱。'''，Widget buildAutoLinkRichText {
// 正则匹配链接与邮箱
final linkRegExp = RegExp(
r'+|+@+\.{2。}',caseSensitive: false,);return SelectableText.rich(
TextSpan(
style这方面，const TextStyle,children: RichTextExt.createTextSpansByRegExp(
再看text，autoLinkText,regExp: linkRegExp。linkStyle: const TextStyle(
fontSize: 14,color: Colors.blue,fontWeight: FontWeight.w600,decorationColor: Colors.blue,decoration: TextDecoration.underline,),onLink: {
if ) {
openLink;} else {
openEmail;}
},),),contextMenuBuilder:
SelectableRegionExt.editableTextContextMenu。// 自定义长按菜单
onSelectionChanged:
null,// 若为 null 则长按选择无效，可根据需求开启
);}
Future openUrl async {
try {
final launched = await launchUrl;if {
ToastUtil.info;return，}
DLog.d;} catch {
ToastUtil.info;}
}
Future openLink async {
final uri = url.startsWith?Uri.parse : Uri.parse;await openUrl;}
Future openEmail async {
final uri = Uri;按理说，await openUrl;}

三、源码细节

rich_text_ext.dart

// rich_text_ext.dart
import 'package:flutter/gestures.dart';怎么说呢，import 'package:flutter/material.dart';import 'package:flutter/services.dart';extension RichTextExt on RichText {
/// 根据字符串列表创建带高亮的 TextSpan 列表
static List createTextSpans({
required String text。required List textTaps,TextStyle?style,TextStyle?按理说，linkStyle,String prefix = "_&t"。String suffix = "_&t",void Function?onLink,}) {
final pattern = textTaps.map => RegExp.escape).join;final regExp =
RegExp;final textNew = text.splitMapJoin(
regExp。
onMatch: => '$prefix${m}$suffix',onNonMatch: => n,);final list = textNew.split);return list.map {
if (e.isNotEmpty &&
||
textTaps.contains) ||
textTaps.contains))) {
return TextSpan(
text的观点是。e,style:
linkStyle?，const TextStyle,recognizer:
onLink == null?null : TapGestureRecognizer
..onTap = => onLink?.call,)，}
return TextSpan;}).toList，}
/// 根据正则表达式创建带高亮的 TextSpan 列表
static List createTextSpansByRegExp({
required String text。required RegExp regExp,TextStyle?style,TextStyle?linkStyle,String prefix = "_&t"。String suffix = "_&t",void Function?onLink}) {
final links =
regExp.allMatches.map => e.group).whereType.toList;return createTextSpans(
text的观点是。text,textTaps:links,style:text==null?按理说，null:text.isEmpty?null:null,text==null?null:null,text.isEmpty?，false?，false?，text?，'',style?，style，linkStyle:。prefix:suffix,onlink:onlink);}
}

selectable_region_ext.dart 源码

// selectable_region_ext.dart
import 'package:flutter/cupertino.dart';import 'package:flutter/material.dart';import 'package:flutter_templet_project/extension/extension_local.dart';extension SelectableRegionExt on SelectableRegion {
/// 可编辑文本的自定义长按菜单
static Widget editableTextContextMenu{
final anchors=state.contextMenuAnchors;final style=const TextStyle.colorScheme.primary));return CupertinoTextSelectionToolbar(
anchorAbove:absoluteAnchor。anchorBelow:absoluteAnchor,children:
);}
/// 可选择文本的自定义长按菜单
static Widget selectableRegionContextMenu{
return CupertinoTextSelectionToolbar(
anchorAbove:absoluteAnchor。anchorBelow:absoluteAnchor,children:
);}
}

• 主要实现：基于富文本组件 SelectablesRich.text,用正则把链接与邮箱提取为特殊样式的 TextSpan;点击回调可自定义跳转逻辑。
• 可 性：只需修改正则或添加新的匹配规则，即可支持更多场景。
• 第三方方案：  也能实现类似功能。但如果你需要高度定制化，自行封装更灵活。
• User Pain Points Solved： 自动识别多种 URL 与邮箱、提供可自定义的上下文菜单、支持 iOS/Android 一致体验。
• 建议： 在生产环境中考虑缓存已解析结果，以提高性能；注意隐私安全，避免在日志中泄露敏感地址。