What is the exact combination of blocks to export the table as an image or PDF?

Hi :slightly_smiling_face:
I have already read various topics and guides on export methods such as:

  • creating sheets in Google Sheets - is a rather complicated method that I cannot propose to the users of my app. I also don't need to change the data once it's exported.
  • as PDF - would be the best format because it automatically splits into A4 sheets ready to be printed, but from what I have read it seems there are various problems and limitations (need of multiple screens, only works for android, etc).
  • as an image using the ComponentToImage extension - would be the fastest solution, although there will be problems printing a high image.

My understanding of these procedures is limited. Anyway I have tried to apply the suggestions but still I am not able to export my table.

The table will be a long list, scrollable horizontally and vertically.
Mainly it should be sent by e-mail, but possibly also saved in the phone memory (gallery, etc.).
This should work for any type of device and the user should be able to do the operation by clicking a single button: a single click should make the pdf or image file appear in the email, ready to be sent, and at the same time save it in the phone.
...it's possible?

I am not competent in this field, so I ask you to show me the exact combination of blocks so that I can simply reproduce them and I ask you to attach direct links to download the latest versions of the necessary extensions.
Thank You :cherry_blossom: :cherry_blossom:

For a large table, and if an internet connection is available, my advice would be to use a google apps script web app and a google sheet (which has been pre-formatted).

  1. send the data to the web app
  2. The web app sets the data to the pre-formatted google sheet
  3. The web app returns a pdf of the google sheet to the app
  4. The app attaches the downloaded pdf to an email

I did previously provide an example of this for you, if I get some time I will work up some more specific.

Here is a pre-formatted spreadsheet

Make a copy of the sheet ReportTable to your own sheet, or just copy the sheet. Note the conditional formatting. Only paste values (CTRL+SFT+V) and do not just Paste otherwise you can overwrite the conditional formatting.

Here is the web apps script your need:

function doGet(e) {
  var ss = SpreadsheetApp.getActive();
  var sh = ss.getSheetByName('ReportTable');
  var data = e.parameter.data;
  var rng = sh.getDataRange();
  rng.setBorder(true,true,true,true,true,true, "lightgrey", SpreadsheetApp.BorderStyle.SOLID);
  sh.clearContents();
  var arr = JSON.parse(data);
  if ( /^\[{2}/.test(data) === true ) {
    sh.getRange(1,1,arr.length,arr[0].length).setValues(arr);
  } else {
    sh.appendRow(arr);
  }
  var rng = sh.getDataRange();
  rng.setBorder(true,true,true,true,true,true, "grey", SpreadsheetApp.BorderStyle.SOLID_THICK);
  return ContentService.createTextOutput("Data applied to Google Sheet");
}

It is bound to the spreadsheet

To fetch the pdf back from the spreadsheet use this url with the web component:

https://docs.google.com/spreadsheets/d/<sheetID>/export?format=pdf&size=0&fzr=true&portrait=false&gid=<GID>

inserting the ID of your spreadsheet and the Gid of the ReportTable sheet.

Use your preferred method to send the pdf to others

Thanks, this sheet should be prepared by every user of my app who wants to export his data table?

No every user can use the same sheet, you need to setup your blocks so that after the data is submitted, the pdf is returned. Then the next user can do the same. Hopefully there will be no collisions!

Yes, so I understood correctly by reading the method you had provided for me earlier. In fact, this method is too complicated to propose it to my app users. After reading your document I found two other methods of exporting the table: with an extension that saves pdf directly to the internal memory or, even faster method, an extension that creates the image.
I would need to see the exact blocks of how to apply these two methods and send the files with just one click. I have to facilitate the user as much as possible :slight_smile:

Why will this be too complicated for your users?

One button to click to upload the data and download the pdf, everything done in the blocks and the script.

ah, so all users will use my single sheet that I post on the web? ... and what if more users want to save their pdf at the same time? ...the collisions could easily happen :joy:
If you think it's an easy thing to apply and it doesn't slow down my app too much then please show me the blocks and components,
thank you :cherry_blossom:

Blocks much the same as here:

https://groups.google.com/g/mitappinventortest/c/lLUGkYwn7SM/m/OpGPOlfAAgAJ

but for your data post as follows:

image

(if the "GET" doesn't work because the url is too long, you will have to change to doPost(e) in the script and use the Posttext block in the app.)

...so I did like this:

  • I made a copy of your sheet and renamed it.
    ...you wrote: "...Only paste values (CTRL + SFT + V) and do not just Paste..."
    I didn't know what I should have paste and where, so didn't paste anything.

  • I looked for "script editor" and it was not in the tools

...but I found it in the extensions

I saw your script already there

  • I copied ID of my spreadsheet together with Gid from the url

  • I added two web components to my project in app inventor, then I set the blocks

Finally on my phone I loaded the data into the table, I clicked the "Export Table" button and the message was: "PDF not available"
:joy:
What did I do wrong?

..ah, now I also changed in the script: doPost(e)

and in the blocks

06b

...still nothing happens :slight_smile:

OK, you are getting in a muddle :slight_smile:

Give me a few minutes and I will put together the correct blocks for you

:slight_smile: ...since I have not the table pasted in my new file that I've redone from scratch yet, I'm testing it on the old file with two screens where you set the dynamic table

See attached aia project, which will save a pdf to the application specific directory and display it in a webviewer using my viewpdf extension.

getReport.aia (20.4 KB)

!important

There are two changes to the script:

  1. now a doPost(e) instead of a doGet(e)
  2. var data = e.postData.contents
function doPost(e) {
  var ss = SpreadsheetApp.getActive();
  var sh = ss.getSheetByName('ReportTable');
  var data = e.postData.contents;
  var rng = sh.getDataRange();
  rng.setBorder(true,true,true,true,true,true, "lightgrey", SpreadsheetApp.BorderStyle.SOLID);
  sh.clearContents();
  var arr = JSON.parse(data);
  if ( /^\[{2}/.test(data) === true ) {
    sh.getRange(1,1,arr.length,arr[0].length).setValues(arr);
  } else {
    sh.appendRow(arr);
  }
  var rng = sh.getDataRange();
  rng.setBorder(true,true,true,true,true,true, "grey", SpreadsheetApp.BorderStyle.SOLID_THICK);
  return ContentService.createTextOutput("Data applied to Google Sheet");
}

remember to republish as a new version

BLOCKS

What you send in posttext must be an AI2 list, and you must have showListsAsJson ticked in Screen1.Propeties

SCREEN

image

should I add a new screen for webviewer and other components? ...or just new page in screen1?

It is really just a demo app to show the pdf output, you can choose how you want things to be.

I have updated the web2 call so that only the formatted area of the sheet is returned to the pdf

getReportv1.1.aia (21.0 KB)
image

BLOCKS

...where should I set it:
in screen 2 (with the table) as a new page (arrangement)
or
in a new screen (screen3)?

As I said, it is up to you. You do not have to display it, you wanted to send it by email ?

Different Email Solutions for App Inventor on puravida apps

so, since I don't need to see it, I just want to open directly the popup with the choice (mail, etc) when I click the "Export Table" button below the table, so I don't need the web viewer component, just the sharing component, right?

...then, you have filled in the google sheet just to have an example of the return of the pdf with some data?
Can I create a new sheet, set the number of columns that correspond to my table, leave the sheet blank, and insert the script only?