Embedding User Images in PDF Outputs from Power Apps

Producing a polished PDF from a canvas app usually involves sending data to Power Automate, which merges it into a Word template. Text fields are straightforward, but images — such as signatures, photographs, or diagrams — require extra steps. In this article, you'll build a solution that captures an image in Power Apps, injects it into a Word document using a content control, and delivers a finalized PDF via email.

Scenario: Service Completion Certificate

Consider a mobile app used by field technicians to record service visits. Before leaving, they ask the customer to sign digitally on the device. A PDF "Service Completion Certificate" is then generated automatically and emailed both to the customer and the office. The PDF must contain the customer's signature alongside pre‑populated job details.

Instead of a sales contract (common in many examples), a service‑order scenario keeps the explanation fresh. You can adapt the same mechanics to any form that requires an embedded image.

Building the Canvas App

Start by creating a new tablet app from blank in Power Apps Studio. Add the following controls:

• A Label with the service‑terms text (use any placeholder text you prefer).
• A Pen Input control named PenSignature where the user will sign.
• A Button named BtnGeneratePDF to submit.

The signature image will be sent to a flow when the button is pressed.

For the button's OnSelect property, call the flow (which we'll build later) and pass the signature record directly.

OnSelect = FlowGeneratePDF.Run({ FlowImage: PenSignature.Image })

PenSignature.Image is a record containing contentBytes, name, and contentType. The flow's trigger will accept this as a file input.

Preparing the Word Template

The key to embedding an image lies in a Word content control.

1. In Microsoft Word, enable the Developer tab (right‑click the ribbon → Customize Ribbon → check Developer).
2. Type the service terms into the document.
3. From the Developer tab, insert an Image Content Control (the icon shows a mountain landscape).
4. Right‑click the content control → Properties. Set:
   • Title: CustomerImage
   • Tag: CustomerImage
5. In the Size and Position settings, uncheck Lock aspect ratio and enter dimensions that roughly match the pen input area. For this example, Height: 1.5", Width: 5". This helps avoid cropping.
6. Save the document to a SharePoint document library or OneDrive.

Constructing the Power Automate Flow

In Power Automate, create an Instant cloud flow with the Power Apps (V2) trigger.

1. Add a file input to the trigger. Expand the trigger → Add input → File → Name it FlowImage. Make it required.

2. Compose the image payload. Add a Compose action. The Word Online connector requires the image in a JSON object with base64 content.

{
"$content-type": "image/jpeg",
"$content": base64(triggerBody()?['FlowImage']?['contentBytes'])
}

The base64() function converts binary content to a base64 string.

1. Populate a Microsoft Word template. Add the Populate a Microsoft Word template action (Word Online Business connector). Point it to your template file. For the CustomerImage field, use the output of the Compose action (dynamic content).

2. Create a temporary Word file. Add Create file (OneDrive for Business or SharePoint). Use the populated document from the previous step as the file content. You can name it dynamically, for example: Completion_Report_{ticks}.docx.

3. Convert to PDF. Use the Convert Word Document to PDF action (Word Online Business). Provide the file ID from the Create file step.

4. Send the PDF by email. Use Send an email (V2) (Office 365 Outlook) and attach the PDF from the conversion step.

The flow should follow this sequence:

Power Apps V2 trigger
├─ Input: FlowImage (File)
Compose – build image JSON
Populate Microsoft Word template – map CustomerImage
Create file – save .docx to OneDrive
Convert Word Document to PDF
Send an email – attach PDF

Connecting the Flow to the App

Back in Power Apps, add the flow as a data source. Use the formula shown earlier for the button's OnSelect:

BtnGeneratePDF.OnSelect =
FlowGeneratePDF.Run({ FlowImage: PenSignature.Image })

No extra parameters like name are needed because the flow only uses the content bytes. The image's file name is inherited from the pen input record.

Common Issues & Troubleshooting

Security and Performance Considerations

• File size limits: The Populate action accepts images up to about 5 MB. Keep pen input dimensions reasonable to avoid overly large files.
• Data loss prevention (DLP): Your environment must allow the Word Online Business, OneDrive/SharePoint, and Office 365 connectors in the same DLP policy.
• Delegation: Not applicable; the flow processes all data in the cloud.
• Async processing: The conversion runs asynchronously and may take a few seconds. Inform users to wait briefly after submitting.

Final Recommendation

The combination of a Word image content control plus Power Automate’s Populate and Convert actions is the most reliable method to embed images into PDFs from Power Apps. It works equally well for signatures, photographs, or any static image a user provides. While HTML‑based alternatives exist, this approach gives you full control over document layout using the familiar Word editor.

If you need richer PDF capabilities — multiple pages, dynamic tables — expand the Word template with nested tables and repeating sections, all of which can coexist with image fields.

References

• Original technique inspiration: Power Apps Add An Image To A PDF Form – Matthew Devaney
• Microsoft Learn: Populate a Microsoft Word template
• Microsoft Learn: Convert Word Document to PDF
• Microsoft Learn: Pen input control in Power Apps