1

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!! :)

enter image description here

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,
        ),
      ),
    );
  }
}
DeC
  • 2,226
  • 22
  • 42
Matias Porra
  • 13
  • 1
  • 4

2 Answers2

1

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>
이아현
  • 26
  • 1
  • REALLY THANK YOU! How did you know that? I already checked all the documentation and it doesn't say anything about the extra code in index.html haha. – Matias Porra Jun 07 '20 at 02:21
  • I see that I was missing: Do you know if I can use this code for a Comercial use? – Matias Porra Jun 07 '20 at 02:28
0

I can't comment on the response, so adding my comment as an answer. I spent a whole day on this issue, till I found this. This solves the problem, and it is not documented anywhere. This should be added to the git repo of this library.

Matias So this is fine to use commercially.

Yunus Temurlenk
  • 4,085
  • 4
  • 18
  • 39
user13902524
  • 1