如何在Flutter应用中读写RTF文件并实现查看功能？

针对你的需求，除了手动构建RichText，以下几种方案更高效且能更好还原RTF格式：

1. 用RTF解析库自动生成富文本 #

借助专门的Flutter RTF解析包（比如rtf_parser），将RTF文件内容解析为带样式的结构化数据，再自动转换为Flutter可渲染的富文本组件（如Text.rich），无需手动拼接TextSpan。

示例代码：

import 'package:flutter/services.dart';
import 'package:rtf_parser/rtf_parser.dart';

Future<void> renderRtfFile() async {
  // 读取assets中的RTF文件内容
  final rtfString = await rootBundle.loadString('assets/sample.rtf');
  // 解析RTF内容
  final parser = RtfParser();
  final rtfDoc = parser.parse(rtfString);
  
  // 构建TextSpan列表
  final List<TextSpan> textSpans = [];
  for (final element in rtfDoc.elements) {
    if (element is RtfText) {
      textSpans.add(TextSpan(
        text: element.text,
        style: TextStyle(
          fontWeight: element.isBold ? FontWeight.bold : FontWeight.normal,
          fontStyle: element.isItalic ? FontStyle.italic : FontStyle.normal,
          color: element.color ?? Colors.black87,
          fontSize: element.fontSize?.toDouble() ?? 14,
        ),
      ));
    }
  }
  
  // 用Text.rich渲染
  setState(() {
    displayText = Text.rich(TextSpan(children: textSpans));
  });
}

2. 利用WebView直接加载RTF #

借助WebView的原生解析能力，直接加载本地RTF文件或转换后的HTML内容，这种方式能最大程度还原RTF的复杂样式（比如表格、图片）。

示例代码（加载本地RTF文件）：

import 'package:webview_flutter/webview_flutter.dart';

WebView(
  initialUrl: 'asset:///assets/sample.rtf',
  javascriptMode: JavascriptMode.unrestricted,
  // 可选：添加加载进度监听或错误处理
)

注：不同平台WebView对RTF的支持略有差异，建议在iOS和Android上分别测试。

3. 调用平台原生控件渲染 #

通过Flutter的平台通道，在iOS端使用WKWebView、Android端使用系统WebView或第三方原生RTF控件来加载文件。这种方式依赖原生平台的成熟解析引擎，样式还原度最高，但需要编写少量原生代码。

比如iOS端可在Swift中直接加载RTF文件，通过MethodChannel将渲染结果传递给Flutter；Android端同理，用Kotlin实现RTF加载逻辑后与Flutter通信。

4. 转换为PDF后查看 #

如果仅需查看无需编辑，可先将RTF转换为PDF格式（可通过后端工具或本地转换库完成），再用Flutter的PDF查看包（如pdf_viewer_plugin）展示。PDF的跨平台展示一致性更好，适合固定内容的查看场景。

内容的提问来源于stack exchange，提问作者Leong