如何在Flutter中实现带字体样式的文本复制功能?
Flutter复制文本保留字体样式的解决方法
Flutter官方提供的默认Clipboard.setData方法仅支持传入纯文本内容,所以复制时会丢失所有字体样式,你可以根据使用场景选择对应的解决方案:
仅在当前App内部粘贴使用
- 自定义剪贴板数据存储结构,同时存储文本内容和对应的样式参数(字体大小、字重、颜色、行高等)
- 粘贴时读取自定义结构的数据,同时还原文本内容和对应样式即可
- 该方案实现简单,但不支持跨App粘贴带样式内容
需要支持跨App粘贴带样式内容
需要适配iOS、Android双端的系统富文本剪贴板能力,可通过Flutter平台通道自行封装,也可使用已有的封装实现:
- Android端使用
SpannableString存储带样式内容,写入系统剪贴板时同时设置HTML格式的富文本数据和纯文本兜底数据 - iOS端使用
NSAttributedString存储带样式内容,写入系统剪贴板时同时设置RTF/HTML格式的富文本数据和纯文本兜底数据 - 调用示例:
// 构造需要复制的富文本 final copyRichText = TextSpan( children: [ TextSpan(text: '加粗文本', style: TextStyle(fontWeight: FontWeight.bold)), TextSpan(text: '红色文本', style: TextStyle(color: Colors.red, fontSize: 18)), ] ); // 写入富文本到系统剪贴板 await RichClipboardUtil.setRichText(copyRichText); // 粘贴时读取 final ClipboardRichData data = await RichClipboardUtil.getRichText(); if (data.hasRichContent) { // 直接渲染读取到的TextSpan即可还原样式 renderText = Text.rich(data.richContent!); } else { // 降级使用纯文本 renderText = Text(data.plainText ?? ''); }
- 注意:跨App粘贴时样式能否正常还原取决于接收粘贴的App是否支持解析对应的富文本格式,若接收方仅支持纯文本,会自动展示兜底的纯文本内容
内容的提问来源于stack exchange,提问作者19TUCS138 NITHINRAAJ J
相关产品推荐
相关产品推荐

