[syncfusion_flutter_pdf] How to detect the end of the page and add a new grid to the next page

[arbazadam13]

Basically i am trying to achieve pagination, I have a document and an api which gives me over 6000 records. In my document i need to display these records as recieved in a PdfGrid. My question is, while reading the data and populating it in a PdfRow, how do i add a new page and draw a new grid on that page with the next set of data? Say my first page holds 11 records in the data grid. How do i show the next 11 in the next page in the new grid? Any help will be appreciated.

[Surya-3013]

Hi @arbazadam13 ,

We recommend you identify the PdfGrid records by using the following code, grid.rows.count

If grid rows(records) cross the limitation, kindly draw that grid on the specific page and starts with the new PdfGrid object. Kindly refer to the below code, // Whenever draw the grid using the below code, always draw in a new page. grid.draw(page: document.pages.add(), bounds: const Rect.fromLTWH(0, 200, 0, 0));

Note: document.pages.add() will create new page whenever we will this method. And refer to the following documentation to get more details on PdfGrid, https://help.syncfusion.com/flutter/pdf/working-with-tables

Regards, Surya V

[arbazadam]

Hello @Surya-3013 , thank you for your response. However i am still confused and playing around with it. This is what i am trying to achieve

[arbazadam]

Is there a utility in the library which will automatically add a new page and the new grid when the content on the current page is reached to the end. Otherwise in my case i need to put a threshold value, say 10 rows in a grid and the 11th row should be a new grid on the new page. Please guide me further on this. Thanks and regards !

[Surya-3013]

Hi @arbazadam ,

We have created a sample code snippet to achieve your requirement of a repeat grid header in all pages and move to the next page if reached the specific bound value which will be automatically achieved by using our PDF library. We recommend you try with the following code snippet and let us know the result,

Future<void> _createPdfGrid() async {
    //Create a new PDF documentation
    PdfDocument document = PdfDocument();
    PdfPage page = document.pages.add();
//Create a PdfGrid
    PdfGrid grid = PdfGrid();

//Enable Repeat header for getting header in all pages
    grid.repeatHeader = true;

//Add the columns to the grid
    grid.columns.add(count: 3);
    grid.headers.add(1);
    PdfGridRow header = grid.headers[0];
    header.cells[0].value = 'Name';
    header.cells[1].value = 'Age';
    header.cells[2].value = 'Sex';

//Add rows to grid. Set the cells style
    for (var i = 0; i < 500; i++) {
      PdfGridRow row = grid.rows.add();
      row.cells[0].value = "First name";
      row.cells[1].value = "24";
      row.cells[2].value = "Male";
      row.height = 70;
    }

//Create a PdfLayoutFormat for pagination
    PdfLayoutFormat format = PdfLayoutFormat(
        breakType: PdfLayoutBreakType.fitColumnsToPage,
        layoutType: PdfLayoutType.paginate);
    final Rect bounds = Rect.fromLTWH(
        0, 10, page.getClientSize().width, page.getClientSize().height - 100);
    format.paginateBounds = bounds;

//Draw the grid in PDF document page
    grid.draw(page: page, bounds: bounds, format: format);

//Save the document
    List<int> bytes = document.save();
    //Dispose the document
    document.dispose();

    //Save and launch file.
    await FileSaveHelper.saveAndLaunchFile(bytes, 'PdfGrid_RepeatHeader.pdf');
  }

Refer to the following articles for more details on this, https://help.syncfusion.com/flutter/pdf/working-with-tables#pagination-in-pdfgrid https://pub.dev/documentation/syncfusion_flutter_pdf/latest/pdf/PdfGrid/repeatHeader.html

Regards, Surya V

[arbazadam]

First of all, a big thank you for going out of the way and creating a snippet for my use case. This will surely help me solve the problem. I'll highly recommend people to use this library for 2 reasons. One being the simplicity it offers and other is the support which the maintainers provide. I hope after referring to the above snippet my issue will be solved. @Surya-3013