Add images taken with camera package to pdf

问题

I am using camera package in order to take images from my phone. Now I want to convert those images to one single pdf file by clicking on a button. For that I am using pdf package. The problem is, when I take an image/images and click on the button I am always getting this exception:

Exception: This widget created more than 20 pages. This may be an issue in the widget or the document

I have read many suggestions here: #145, #146 and here stack but nothing helped in my case.

Only case where I have managed to create a pdf was when I cropped the images to a really small size. FYI this is what I have used for cropping image_cropper

Here are the code snippets that are in charge for adding images to pdf and saving them.

Button:

                        Expanded(
                          child: RaisedButton(
                            color: _appTheme.blueGrey,
                            onPressed: () async {
                              await _addImagesToPdf();

                              final _filePath = await _savePdf();

                              model.navigateToUploadImagePage(_filePath);
                            },
                            child: Text(model.nextOrUploadLabel.toUpperCase(),
                                style: Theme.of(context).textTheme.headline1),
                          ),
                        ),

import 'package:pdf/pdf.dart';
import 'package:pdf/widgets.dart' as pw;


 
  //PdfImage _image;
  final _pdf = pw.Document();
  final _image = <PdfImage>[];
  final _imageFit = <pw.BoxFit>[];


  Future<void> _addImagesToPdf() async {
    // for (var i = 0; i < _model.imageFilePaths.length; i++) {
    //   _image = PdfImage.file(
    //     _pdf.document,
    //     bytes: File(_model.imageFilePaths[i]).readAsBytesSync(),
    //   );
    // }

    //trying with list of pdf images => Best solution for now. It uploads
    //multiple images but only when they are cropped by a lot
    for (var i = 0; i < _model.imageFilePaths.length; i++) {
      _image.add(
        PdfImage.file(
          _pdf.document,
          bytes: File(_model.imageFilePaths[i]).readAsBytesSync(),
        ),
      );
      _imageFit.add(pw.BoxFit.values[i]);
    }

    _pdf.addPage(
      pw.MultiPage(
        // maxPages: _model.imageFilePaths.length,
        pageFormat: PdfPageFormat.a4,
        //margin: const pw.EdgeInsets.all(32),
        build: (context) => <pw.Widget>[
          //If you wrap everything inside a column, the framework cannot
          //create new pages: a Column is seen as one object
          //that cannot be split. You can try Wrap instead.(Comment from author)
          pw.Wrap(
            children: <pw.Widget>[
              for (var i = 0; i < _image.length; i++)
                pw.ClipRect(
                  child: pw.Image(
                    _image[i],
                    fit: _imageFit[i],
                  ),
                ),
            ],
          ),
        ],
      ),
    );
  }

  Future<String> _savePdf() async {
    final tempDir = await getTemporaryDirectory();
    _file = File('${tempDir.path}/${DateTime.now()}.pdf')
      ..writeAsBytesSync(_pdf.save());

    return _file.path;
  }

UPDATE: It's working now and this is the code if someone is having same troubles as I did. P.S. Update your pdf package to the latest version(1.13 in my case)

final _image = <pw.Image>[];

Future<void> _addImagesToPdf() async {
    for (final imgPath in _model.imageFilePaths) {
      final bytes = File(imgPath).readAsBytesSync();
      _image.add(pw.Image.provider(
        pw.MemoryImage(bytes),
      ));
}

    for (final img in _image) {
      _pdf.addPage(
        pw.Page(
          pageFormat: PdfPageFormat.a4,
          build: (context) => pw.Center(
            child: pw.Container(child: img),
          ),
        ),
      );
    }
  }

来源：https://stackoverflow.com/questions/65422879/add-images-taken-with-camera-package-to-pdf

标签

file

Flutter

pdf

camera

multipage