pdf 1.8.1 Flutter-无法显示文档 [英] pdf 1.8.1 Flutter - Unable to display the document
问题描述
我正尝试使用
在"hello world"代码下面，该代码向我显示了相同的错误.
import'package:pdf/pdf.dart';以pw格式导入"package:pdf/widgets.dart"；导入'package:flutter/material.dart';导入'package:printing/printing.dart';导入'dart:typed_data';void main()=>runApp(MyApp());MyApp类扩展了StatelessWidget {最后的pw.Document doc = pw.Document();@override窗口小部件build(BuildContext context){Future< Uint8List>generateDocument(PdfPageFormat格式)异步{doc.addPage(pw.Page(pageFormat:PdfPageFormat.standard，构建:(pw.Context上下文){返回pw.Center(子级:pw.Text("Hello World")，);//中心}));//页返回doc.save();}返回MaterialApp(标题:材料应用"，家:脚手架(appBar:AppBar(标题:文本(材料应用栏")，)，正文:PdfPreview(maxPageWidth:700，构建:generateDocument，)，)，);}} 您添加了JavaScript代码吗?您应该将代码添加到index.html.
)像这样
<！DOCTYPE html>< html>< head>< meta charset ="UTF-8">< meta content ="IE = Edge" http-equiv ="X-UA-Compatible"><元名称=说明" content ="Rakuraku Flutter.">< ;!-iOS元标记&图标->< meta name ="apple-mobile-web-app-capable" content ="yes"><元名称="apple-mobile-web-app-status-bar-style" content =黑色"><元名称="apple-mobile-web-app-title" content ="rakuraku">< link rel ="apple-touch-icon" href ="/icons/Icon-192.png"><！-Favicon->< link rel =快捷方式图标" type ="image/png" href ="/favicon.png"/>< title> rakuraku</title>< link rel ="manifest" href ="/manifest.json"></head>< body id ="flutter">< ;!-此脚本安装service_worker.js来提供PWA功能以应用.有关更多信息，请参见:https://developers.google.com/web/fundamentals/primers/service-workers->< script>if(导航器中的"serviceWorker"){window.addEventListener('load'，function(){navigator.serviceWorker.register('/flutter_service_worker.js');});}</script>< script src ="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.min.js"</script>< script type ="text/javascript">pdfjsLib.GlobalWorkerOptions.workerSrc ="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.worker.min.js";</script>< script src ="main.dart.js" type ="application/javascript"></script></body></html> I was trying to use PDF library for Flutter using the package here
the idea is to create something like this: which is the example in the package's page.
the problem is that if I run the Demo example there, it works exactly as the example, which is fine.
But if I create a new project and COPY/PASTE all *.dart files and pubspec.yaml : it doesn't work. The script creates the file, I can downloading it or print it as well, but doesn't show the file.
I'm not using project with more information, I'm just copying the same code to a clean project and I'm also getting packages in pubspec.yaml
did someone has the same problem? I will post an image below.
in addition: I'M RUNNING BOTH PROJECTS AS FLUTTER WEB, IN CHROME
thank you for your help!! :)
below a 'hello world' code that showed me the same error..
import 'package:pdf/pdf.dart';
import 'package:pdf/widgets.dart' as pw;
import 'package:flutter/material.dart';
import 'package:printing/printing.dart';
import 'dart:typed_data';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
final pw.Document doc = pw.Document();
@override
Widget build(BuildContext context) {
Future<Uint8List> generateDocument(PdfPageFormat format) async {
doc.addPage(pw.Page(
pageFormat: PdfPageFormat.standard,
build: (pw.Context context) {
return pw.Center(
child: pw.Text("Hello World"),
); // Center
})); // Page
return doc.save();
}
return MaterialApp(
title: 'Material App',
home: Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
body: PdfPreview(
maxPageWidth: 700,
build: generateDocument,
),
),
);
}
}
did you add the javascript code? you should add the code in the index.html.
for example) like this,
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="Rakuraku Flutter.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="rakuraku">
<link rel="apple-touch-icon" href="/icons/Icon-192.png">
<!-- Favicon -->
<link rel="shortcut icon" type="image/png" href="/favicon.png"/>
<title>rakuraku</title>
<link rel="manifest" href="/manifest.json">
</head>
<body id="flutter">
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('/flutter_service_worker.js');
});
}
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.min.js"></script>
<script type="text/javascript">
pdfjsLib.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.worker.min.js";
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
这篇关于pdf 1.8.1 Flutter-无法显示文档的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
