Generating Documents from Power Apps with Adobe PDF Services

This is a two-part series on how to use Adobe PDF Services and Adobe Acrobat Sign connectors with Microsoft Power Apps Canvas-apps.

Microsoft PowerApps can integrate with Adobe PDF Services and Adobe Acrobat Sign.

Microsoft Power Apps are a great way to create an app or mobile app connected to your data, whether it is Dataverse, SharePoint, or some of the other 300+ connectors available. Adobe PDF Services and Adobe Acrobat Sign connectors provide a great way to embed document experiences within your own apps.

In this first part of a three-part series, we are going to see how you can generate a document from data within your Power Apps.

Example App

In this scenario, we have an app that we are using to help us manage offer letters for candidates to an organization. This app connects to a Microsoft List to manage each one of the candidates, and it uses that information to then generate a document using Adobe Document Generation service.

For the purpose of this demo, the Microsoft List has the following columns:

• First Name (Text Field)
• Last Name (Text Field)
• Title (Text Field)
• Email (Text Field)
• Street (Text Field)
• City (Text Field)
• State (Dropdown)
• Zip (Number)

These are for demonstration purposes, you can use any fields within your list.

If you have never created a Microsoft List before, or formerly known as SharePoint List, you can create one here.

What you will need

• Microsoft Power Apps
• Microsoft Power Automate (access to premium connectors required)
• Adobe PDF Services connector

If you have not already created your credentials, you can create your credentials as a trial in a few easy steps.

Create your template

To create a template, you can create your own schema for your document using Adobe Document Generation Tagger directly within Microsoft Word.

If you not used Adobe Document Generation Tagger, you can install it from Microsoft App Source.

1. If you have Document Generation Tagger add-in, click on Document Generation in the Ribbon.
2. Click Get Started.
3. Click on Continue without JSON data.

Create tags

For each of the items we want to merge into the document:

1. Click on Create Tag.
2. Set the Name of the field.
3. Click Create.

You can also check Add Another if you are going to create many.

For this Offer Letter document, we are using the following fields:

• FirstName
• LastName
• Title
• Salary
• SigningBonus
• OwnerName

For the paragraph related to a signing bonus, we can make this conditional by doing the following:

1. Select the paragraph with your cursor.
2. In Document Generation Tagger, click on Advanced.
3. Expand Conditional Content.
4. In Select Records, select the SigningBonus property.
5. In Select Operator, choose >.
6. In Value, set it to 0.

This will add a wrapper around that paragraph and only include it if the SigningBonus value meets that criteria.

Formatting a number

If you have a number that is being passed that you want to format like add comma separators and trailing zeros, you can format the number by entering the following:

{{$formatNumber(variableName, '#,###.00')}}

A few important notes when doing this:

• Microsoft Word might replace your quotation marks with fancy quotes. You will want to make sure that doesn’t happen.
• Replace variableName with whatever is the name of the property you want to format.

Preview the document

When you are creating the template, you can always preview the document by clicking on Generate document. It will prompt you to enter in some sample information, and then you can see a preview.

Save a copy of your JSON schema

Since we created our schema in Word, we want to save the schema we just created as we will use that for our flow later on.

1. Click on Continue.
2. Click Export JSON.
3. Click Copy to clipboard.

Here is an example:

{
    "FirstName": "FirstName_value",
    "LastName": "LastName_value",
    "Email": "Email_value",
    "Title": "Title_value",
    "Salary": 0,
    "SigningBonus": 0,
    "OwnerName": 0
}

Save your document to SharePoint or OneDrive

In order to access this document in Microsoft Power Automate, we will need to have this document accessible in a file storage system, such as OneDrive or SharePoint.

Create app

In this tutorial, we are not going to cover creating the entire Power App, however here are the important elements we have in our app:

Connections

For this, we will need just one connection to get the candidate information for each of the components. In this example, we are accessing our list in SharePoint.

1. In the sidebar, click on Data.
2. Click + Add data.
3. Search for SharePoint.
4. Select SharePoint.
5. Select which connection. If you don’t have one, then create a new SharePoint connection.
6. Choose your SharePoint list from the Recent Sites or input your SharePoint URL.
7. Click Connect.
8. Check the box next to the Candidates list in SharePoint.
9. Click Connect.

Components

gallery_Candidates A Gallery component which lists the items from the Candidates list. It has some of these parameters:

• Items: Candidates (the SharePoint connection)

form_viewCandidates A Forms component that is connected to the gallery_Candidates component.

• DataSource Candidates (the SharePoint connection)
• Item: gallery_Candidates.Selected

btn_Preview This is the button we will use to trigger the document getting generated from the selected item in the app.

Create a new flow

Now that we have our app, we need to create a flow to get the data from our app and pass it to Adobe Document Generation service through the Adobe PDF Services connector in Microsoft Power Automate.

In our flow, we want to do the following:

• Get the file content from the Word template in SharePoint
• Get the item information from Microsoft List
• Generate a document
• Save to SharePoint
• Share a link for the saved item in SharePoint
• Return the link back to the app with a URL and path to the file.

1. In the sidebar, click on Power Automate.
2. Click + Add flow.
3. Click Create new flow.
4. Click Create from blank.
5. In the top-right corner, click on Untitled to change the name of the flow. Ex. GenerateOfferLetter.

Get file content

First, we need to get the file content of the Word template for our Offer Letter.

1. Click on + New step.
2. Search for SharePoint and select SharePoint.
3. Search for Get File content.
4. In Site Address, select your SharePoint site.
5. In File Identifier, click the Folder icon to navigate to the location of your Word template.

Get item information

Now that we have the file content of the template, we want to get the information about the item in the Microsoft List.

1. Click on + New step.
2. Search for SharePoint and select SharePoint.
3. Search for Get Item.
4. In Site Address, select your SharePoint site.
5. In List Name, select your list. Ex. Candidates
6. In File Identifier, click the Folder icon to navigate to the location of your Word template.
7. In the Id field, use Dynamic content panel to select Ask in PowerApps.

Generate document

Now that we have all of our data, we can generate the document.

1. Click on + New step.
2. Search for Adobe PDF Services and select it.
3. Search for Generate document from Word template.
4. If you are prompted to create a new connection, follow the instructions here.
5. In the Template File Name field, set a filename such as file.docx.
6. In Merge Data, paste the JSON data schema we created in Word earlier.
7. In the File Content field, use Dynamic content panel to set it to File Content from the Get file contents action.

Now that we have the action created, let’s map our data from SharePoint into the properties of the document.

1. With you cursor, select the value of First Name in the JSON data.
2. Using Dynamic content panel, replace it with the First Name value from SharePoint.
3. Repeat this for each of the different items.

Pro Tip: If you want to generate a Word document, you can click on Show Advanced Options and set Output Format to DOCX.

Save file to SharePoint and get Share Link

In order to open the document from the PowerApp, we will need to save the file to SharePoint and get an accessible link to do that.

1. Click + New step.
2. Search for SharePoint and select it.
3. Search for Create File and select it.
4. In the Site Address, specify your SharePoint site.
5. In the Folder Path, set where in your SharePoint site you want the file to be saved.
6. In the File Name field, set the file name.
7. In the File Content field, use Dynamic content panel to set it to Output File Content from the Generate document from Word template action.

To get the share link:

1. Click + New step.
2. Search for SharePoint and select it.
3. Search for Create File and select it.
4. In the Site Address, specify your SharePoint site.
5. Set the Library Name to your Document library. Ex. Documents.
6. In Item Id, use the Dynamic content panel to set this to ItemId from the Create file action.
7. For Link Type, specify whether the person can view or edit.
8. For Link Scope, set to either people in your organization or public.

Respond to Power Apps

Now that we have our share link and document in SharePoint, let’s pass the information back to our PowerApp.

1. Click + New step.
2. Search for PowerApps and select PowerApps.
3. Select Respond to PowerApp or flow.
4. Click + Add an output to add two text outputs: docPath and docURL. These will be used to pass the path to the document in SharePoint and the URL to open to view the document respectively.
5. Using the Dynamic content panel, set the docPath value to Path from the Create file action.
6. Set the docURL value to Sharing Link from the Create a sharing link for a file or folder action.

Save your flow

In the top-right corner, click Save. This may close your flow. If not, once it is finished saving, close your flow.

Add to button in PowerApps

Now that we have our flow, we just need to hook it up to our button in our PowerApp.

1. Select your button on your canvas.
2. In the right sidebar, click to the Advanced tab.
3. Put your cursor in the OnSelect field.

We can simply run the flow, but we want to capture the value results from the flow, so we need to use a Set() action to set a variable to capture the variables.

Set(previewDoc, GenerateOfferLetterATB.Run(gallery_Candidates.Selected.ID));

What the above does is it will call the GenerateOfferLetterATB flow we had created. When it does, it will pass the item value, which is the ID of the selected item in the gallery_Candidates (gallery_Candidates.Selected.ID). The result will be saved using the Set() function to a variable called previewDoc.

Now as a final step we want to launch that URL. After your last command in OnSelect field, add:

Launch(previewDoc.docurl);

This means that based on the output from the flow in the previous step, it will take the result of the docurl value and open a new tab with that URL.

NOTE: Because it is opening in a new tab, pop ups are likely blocked in your browser the first time, so you might need to make sure your pop-ups aren’t blocked.

That’s it! Now you can give it a try.

Test your app

1. Click on the Play button in the top-right corner.
2. Click on the button in your app.

If successful, you will see a preview of the document generated along with your data in the document.

Watch and learn

If you would like to learn on video, we will have a Paper Clips episode where we will walk through how to do this:

Final thoughts

In our next article in this series, we will see how we can take this generated document and send it for signature with Adobe Acrobat Sign and host it for signature within your app.

If this is your first time seeing Adobe PDF Services, don’t forget to give it a try and learn more about how you can get the most out of it with Microsoft Power Automate.

If you are a Microsoft developer, Adobe is at Microsoft Build from May 24–26th 2022. We will have Ask the Experts sessions and learning sessions. Come join in the conversation and see how Adobe and Microsoft are helping transform digital document experiences.

Microsoft Build - Join us May 24-26 2022