You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.06 21:09:04