在颤动中生成带有图像的PDF文件
Generating PDF file with Images in flutter
我需要一些帮助...我正在尝试使用 flutter 生成 PDF 文件(文本和图像),所以我使用了 PDF 包 pdf: ^3.3.0
,生成 PDF 后会显示文本文件,但每次我尝试插入图像时,都会显示以下错误...即使图像正在主屏幕中加载...
错误是
我的代码如下:
import 'dart:io';
import 'dart:typed_data';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:path_provider/path_provider.dart';
import 'package:pdf/pdf.dart';
import 'package:pdf/widgets.dart' as pw;
import 'package:duct_sizer/pdf_preview_screen.dart';
class MyHomePage extends StatelessWidget {
final pdf = pw.Document();
final image = pw.MemoryImage(File('images/duct.jpg').readAsBytesSync());
writeOnPdf() async {
// final profileImage = pw.MemoryImage(
// (await rootBundle.load('images/duct.jpg')).buffer.asUint8List(),
// );
pdf.addPage(pw.MultiPage(
pageFormat: PdfPageFormat.a5,
margin: pw.EdgeInsets.all(32),
build: (pw.Context context) {
return <pw.Widget>[
pw.Header(level: 0, child: pw.Text("Easy Approach Document")),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Header(level: 1, child: pw.Text("Second Heading")),
pw.Image(image),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
];
},
));
}
Future savePdf() async {
final bytes = await pdf.save();
Directory documentDirectory = await getApplicationDocumentsDirectory();
String documentPath = documentDirectory.path;
File file = File("$documentPath/example.pdf");
file.writeAsBytesSync(bytes);
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("PDF Flutter"),
),
body: Container(
width: double.infinity,
height: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
"PDF TUTORIAL",
style: TextStyle(fontSize: 34),
),
Image(
image: AssetImage('images/header.png'),
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () async {
writeOnPdf();
await savePdf();
Directory documentDirectory =
await getApplicationDocumentsDirectory();
String documentPath = documentDirectory.path;
String fullPath = "$documentPath/example.pdf";
print(fullPath);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PDFPreviewScreen(
path: fullPath,
)));
},
child: Icon(Icons.save),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
PDF预览页面为
import 'package:flutter/material.dart';
import 'package:flutter_full_pdf_viewer/flutter_full_pdf_viewer.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_plugin.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_scaffold.dart';
class PDFPreviewScreen extends StatelessWidget {
final String path;
PDFPreviewScreen({this.path});
@override
Widget build(BuildContext context) {
return PDFViewerScaffold(
path: path,
);
}
}
请资产我
这是 pubspec.yaml 文件的新更新,它显示了依赖项和图像标识
也正如我之前所说,照片直接显示在主应用程序中,但PDF会出现此错误
没有您要添加的官方文件的路径。您可以通过右键单击文件中的图片并单击复制相对路径来获取文件路径。那么如果你使用的是windows,你可以在将''\''s转换为'/'并将它们放在pubseps.yaml.
中的资产下后使用文件路径
我找到了解决方案,我联系了 flutter package maker,他很厉害指导我该怎么做,首先他指导我创建了以下函数
final data = await rootBundle.load('images/$name');
return data.buffer.asUint8List();
}
然后他还指导我将PDF创建方法从statless
移动到statfull
并在 writePDF()
中将图像添加为以下代码
final image = pw.MemoryImage(await _readImageData('header.png'));
现在图像显示在 PDF 文件中没有问题
我需要一些帮助...我正在尝试使用 flutter 生成 PDF 文件(文本和图像),所以我使用了 PDF 包 pdf: ^3.3.0
,生成 PDF 后会显示文本文件,但每次我尝试插入图像时,都会显示以下错误...即使图像正在主屏幕中加载...
错误是
我的代码如下:
import 'dart:io';
import 'dart:typed_data';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:path_provider/path_provider.dart';
import 'package:pdf/pdf.dart';
import 'package:pdf/widgets.dart' as pw;
import 'package:duct_sizer/pdf_preview_screen.dart';
class MyHomePage extends StatelessWidget {
final pdf = pw.Document();
final image = pw.MemoryImage(File('images/duct.jpg').readAsBytesSync());
writeOnPdf() async {
// final profileImage = pw.MemoryImage(
// (await rootBundle.load('images/duct.jpg')).buffer.asUint8List(),
// );
pdf.addPage(pw.MultiPage(
pageFormat: PdfPageFormat.a5,
margin: pw.EdgeInsets.all(32),
build: (pw.Context context) {
return <pw.Widget>[
pw.Header(level: 0, child: pw.Text("Easy Approach Document")),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Header(level: 1, child: pw.Text("Second Heading")),
pw.Image(image),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
pw.Paragraph(
text:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Malesuada fames ac turpis egestas sed tempus urna. Quisque sagittis purus sit amet. A arcu cursus vitae congue mauris rhoncus aenean vel elit. Ipsum dolor sit amet consectetur adipiscing elit pellentesque. Viverra justo nec ultrices dui sapien eget mi proin sed."),
];
},
));
}
Future savePdf() async {
final bytes = await pdf.save();
Directory documentDirectory = await getApplicationDocumentsDirectory();
String documentPath = documentDirectory.path;
File file = File("$documentPath/example.pdf");
file.writeAsBytesSync(bytes);
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("PDF Flutter"),
),
body: Container(
width: double.infinity,
height: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
"PDF TUTORIAL",
style: TextStyle(fontSize: 34),
),
Image(
image: AssetImage('images/header.png'),
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () async {
writeOnPdf();
await savePdf();
Directory documentDirectory =
await getApplicationDocumentsDirectory();
String documentPath = documentDirectory.path;
String fullPath = "$documentPath/example.pdf";
print(fullPath);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PDFPreviewScreen(
path: fullPath,
)));
},
child: Icon(Icons.save),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
PDF预览页面为
import 'package:flutter/material.dart';
import 'package:flutter_full_pdf_viewer/flutter_full_pdf_viewer.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_plugin.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_scaffold.dart';
class PDFPreviewScreen extends StatelessWidget {
final String path;
PDFPreviewScreen({this.path});
@override
Widget build(BuildContext context) {
return PDFViewerScaffold(
path: path,
);
}
}
请资产我
这是 pubspec.yaml 文件的新更新,它显示了依赖项和图像标识
没有您要添加的官方文件的路径。您可以通过右键单击文件中的图片并单击复制相对路径来获取文件路径。那么如果你使用的是windows,你可以在将''\''s转换为'/'并将它们放在pubseps.yaml.
中的资产下后使用文件路径我找到了解决方案,我联系了 flutter package maker,他很厉害指导我该怎么做,首先他指导我创建了以下函数
final data = await rootBundle.load('images/$name');
return data.buffer.asUint8List();
}
然后他还指导我将PDF创建方法从statless
移动到statfull
并在 writePDF()
中将图像添加为以下代码
final image = pw.MemoryImage(await _readImageData('header.png'));
现在图像显示在 PDF 文件中没有问题