如何在不使用富文本重写的情况下将 Microsoft word 文件内容嵌入到 flutter 应用程序中
How to embed Microsoft word file content to a flutter application without rewriting it using Rich text
我正在为 Android 和 IOS 开发一个 flutter 应用程序,我想嵌入 Microsoft word 文件 .docx
或 .doc
提供的内容要在应用程序的关于屏幕中查看的客户端。
文件很长,我无法使用 Rich text widget 重写它。文件很简单,没有图片。
我做了一些研究,找到了一些解决方案,讨论将文件转换为 pdf 并嵌入 pdf 视图。我也不喜欢它,因为内容不会作为应用程序的一部分显示,页面分隔符仍然存在。
经过长时间的研究,我发现了 flutter_widget_from_html 包,这是一个了不起的包,可以将您的简单 HTML
转换为 flutter 小部件,并让您可以选择将其用作 webview 或仅用于渲染静态 Html.
我们现在需要将此包添加到 pubspec.yaml
,请始终设置 latest version
dependencies:
flutter_widget_from_html: ^0.3.2+1
现在的挑战是在没有 js
或外部 css
文件的情况下将 word 文档转换为简单的 HTML
文件
我设法找到了一个免费站点 https://wordhtml.com/,它允许您将 word 文件内容粘贴到其编辑器中,它会直接将其转换为 HTML
最后一步是从 HTML
选项卡复制内容并将其插入到小部件
const kHtml = """
<h1>Heading</h1>
<p>A paragraph with <strong>strong</strong> <em>emphasized</em> text.</p>
<ol>
<li>List item number one</li>
<li>
Two
<ul>
<li>2.1 (nested)</li>
<li>2.2</li>
</ul>
</li>
<li>Three</li>
</ol>
<p>Thank you</p>
""";
class HelloWorldScreen extends StatelessWidget {
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: Text('HelloWorldScreen'),
),
body: HtmlWidget(
kHtml,
webView: false,
),
);
}
在我的例子中,我希望内容可以滚动,所以我用列表视图
包围了 HtmlWidget
class HelloWorldScreen extends StatelessWidget {
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: Text('HelloWorldScreen'),
),
body: ListView(
shrinkWrap: true,
children: <Widget>[
HtmlWidget(
kHtml,
),
],
)
);
}
我正在为 Android 和 IOS 开发一个 flutter 应用程序,我想嵌入 Microsoft word 文件 .docx
或 .doc
提供的内容要在应用程序的关于屏幕中查看的客户端。
文件很长,我无法使用 Rich text widget 重写它。文件很简单,没有图片。
我做了一些研究,找到了一些解决方案,讨论将文件转换为 pdf 并嵌入 pdf 视图。我也不喜欢它,因为内容不会作为应用程序的一部分显示,页面分隔符仍然存在。
经过长时间的研究,我发现了 flutter_widget_from_html 包,这是一个了不起的包,可以将您的简单 HTML
转换为 flutter 小部件,并让您可以选择将其用作 webview 或仅用于渲染静态 Html.
我们现在需要将此包添加到 pubspec.yaml
,请始终设置 latest version
dependencies:
flutter_widget_from_html: ^0.3.2+1
现在的挑战是在没有 js
或外部 css
文件的情况下将 word 文档转换为简单的 HTML
文件
我设法找到了一个免费站点 https://wordhtml.com/,它允许您将 word 文件内容粘贴到其编辑器中,它会直接将其转换为 HTML
最后一步是从 HTML
选项卡复制内容并将其插入到小部件
const kHtml = """
<h1>Heading</h1>
<p>A paragraph with <strong>strong</strong> <em>emphasized</em> text.</p>
<ol>
<li>List item number one</li>
<li>
Two
<ul>
<li>2.1 (nested)</li>
<li>2.2</li>
</ul>
</li>
<li>Three</li>
</ol>
<p>Thank you</p>
""";
class HelloWorldScreen extends StatelessWidget {
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: Text('HelloWorldScreen'),
),
body: HtmlWidget(
kHtml,
webView: false,
),
);
}
在我的例子中,我希望内容可以滚动,所以我用列表视图
包围了 HtmlWidgetclass HelloWorldScreen extends StatelessWidget {
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: Text('HelloWorldScreen'),
),
body: ListView(
shrinkWrap: true,
children: <Widget>[
HtmlWidget(
kHtml,
),
],
)
);
}