How to Generate bulk QR/bar code in flutter and save the generated code as PDF?

[Nirmala]

Hi Guys,

I am trying to create a QR/Bar code(bulk  QR/bar code) Generator app in which users are allowed to give the quantity(also some name printed below the bar code) they want to generate and save the generated code as a PDF. What is the best way to generate bulk QR/Bar codes in flutter?

With the below code I am able to generate one QR/Bar code

Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [

        SfBarcodeGenerator(
          barColor: Colors.white,
          value: controller.text,
          //symbology: QRCode(),
          showValue: true,
          textSpacing: 15,
          textStyle: TextStyle(fontSize: 20,color: Colors.red),
        ),
        SizedBox(height: 40),
        Row(
          children: [
            Expanded(child: buildTextField(context)),
            const SizedBox(width: 12),
            FloatingActionButton(
              backgroundColor: Theme.of(context).primaryColor,
              child: Icon(Icons.done, size: 30),
              onPressed: () {
                print("I am from on Pressed");
                Expanded(child: resultTextField(context,controller.text));
              }
            )
          ],
        ),
      ],
    ),

Any help is really appreciated.

Thanks in advance

[Yuvaraj Gajaraj]

Hi Nirmal,

Greetings from Syncfusion. We already have the demo sample for generating the bulk QR code and having a KB to explain how to save the generated QR code as a PDF file. We have attached the KB and demo sample link below for your reference.

KB: https://www.syncfusion.com/kb/12915/how-to-export-a-barcode-generator-as-a-pdf-sfbarcodegenerator

Demo sample: https://flutter.syncfusion.com/#/barcodes/one-dimensional

Code link: https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/barcodes/one_dimensional.dart

If you have any further queries, please get back to us.

Regards,

Yuvaraj.

[Nirmala]

Hi Yuvaraj,

Many thanks for the quick reply. I have used your code to generate bar code and export it as a PDF. Your code works perfectly fine if it's a single page (let's say 1-10 barcodes on a screen). If I create a bulk bar code(let's say 100,200,..) and wrapped the bar code generator container in a SIngleChildScroviw and gave the container height as 500. I am able to view the 100 generated in the scroll view but when I export it as PDF it does export one single container(let's say 10 bar code). How Can I export all the bar codes into PDF?

I have changed your code a bit

from

        return RepaintBoundary(
         /// Rendered a barcode using the SfBarcodeGenerator widget
        child: SfBarcodeGenerator(
            value: 'CODE128',
            showValue: true,
            symbology: Code128(module: 2)
        )
    );

to

final List List.generate(100000, (index) => {"id": index, "name": "$index"}).toList();

     return GridView.builder(
     gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
         maxCrossAxisExtent: 150,
         childAspectRatio: 3,
         crossAxisSpacing: 40,
         mainAxisSpacing: 20),
     itemCount: 20,
     itemBuilder: (BuildContext ctx, index) {
       return RepaintBoundary(
           child: Card(
             elevation: 2,
             child: Container(

               margin: EdgeInsets.symmetric(horizontal: 20),
               decoration: BoxDecoration(
                  // color: Colors.grey,
                   borderRadius: BorderRadius.all(Radius.circular(2))
               ),                child: SfBarcodeGenerator(
                 //value: 'CODE128',
                //   value: index.toString(),
                   value:  myBarCode[index]["name"],
                   showValue: true,
                   symbology: Code128(module: 2)),
             ),
           ));
       });

and I see that this line

page.graphics.drawImage(bitmap, Rect.fromLTWH(0, 0, pageSize.width, pageSize.height));

controls the height of the screen to be exported as PDF. How can I print all the bar codes if its in Scrollable view of a container?

Note: I have attached to working code file. Please find it in the below attachment. Looking forward to your reply.

Thanks

Nirmala Sudhir

Attachment: test_5204cc31.zip

[Yuvaraj Gajaraj]

Hi Nirmala,

We have analyzed your query and found that you can export the widgets which are got rendered as well as in the viewport, if the widget is not viewed, then we can't export the widget. We have also tried generating 10 barcodes and only 5 of them were in the viewport, have given a unique key for each, but we can export the widgets which are in the viewport. Since if the widgets are rendered only, we can convert those to images, and using that only we can draw it in the pdf. As of now, you can generate it by scrolling manually and converting it to an image.

Regards,
Yuvaraj.