In this post, we are going to create an app with SharePoint document library as data source and view word documents as PDF. This will be done in two parts – First part is Flow which converts word document to PDF on the fly and second part is PowerApps which displays the document as pdf.

Part 1 – Flow

• Navigate to https://flow.microsoft.com . Login and create an Instant flow from blank.
• Give name something like DocumentConvertor and select trigger as “When an HTTP request is received”.

• Once created, expand the first action (“When an HTTP request is received”) and set the method as “Get”.
• Click on “New Step” and add “Compose (Data Operations)” action. Click on the “Input” text field and add below expression. Click Ok. (This step is used to get parameter “DocId” from query string which identifies the Id of the document in library.)

trigger()['outputs']['queries']['DocId']

• Click on “New Step” and add SharePoint action “Get File Properties”. Set Site URL, Document Library and Id fields.

• Click on “New Step” and add action “Convert Word Document to PDF”. Set the field values for Location, Document Library and File as per the screenshot. (Note: This is a Premium connector)

File variable accepts value as “/<File Name with extension>”. In case of sub folders, it will be “/<Folder Path>/<File Name with extension>”.

• Click on “New Step” and add action “Response”. Set “Body” as the “PDF Document” from previous action.

• Click “Save” to save the flow. Expand the first action and you see a URL is generated. Copy this URL as we are going to use this in PowerApps.

Part 2 – PowerApp

• Navigate to https://powerapps.microsoft.com. Login and create a new blank canvas app.
• Lets rename the default screen to “MainScreen” and add a Vertical Gallery control with layout as “Title and Subtitle”.

• Set data source as SharePoint document library and fields to Name and Created By (Display Name). See below screenshot.

• Select next arrow icon and add code to the “OnSelect” property as in below screenshot.

• Add a media control “PDF viewer” beside the gallery control. Set “Document” property to “MyPDF” variable created in previous step.

• Since the conversion will take time based on document size, lets add a progress control to be displayed while document is converting to pdf.
• Add Container control “ContainerProgress” (Experimental feature to be enabled to use this control) to the screen and set its X,Y,Height and Width property same as the PDF viewer control.

• Add a label “LabelProgressText” inside container control and set its properties – Text to “Processing. Please wait….“, Color to “RGBA(255,255,255,1)“, X to “ContainerProgress.Width/2 – LabelProgressText.Width/2” and Y to ” ContainerProgress.Height/2 – LabelProgressText.Height/2 “.

• Set a variable to “Set(ShowProgress,false)” on “OnVisible” property of screen.
• Set “Visible” property of ContainerProgress to “ShowProgress“.
• Update “OnSelect” property of next arrow in gallery control to below code.

UpdateContext({ShowProgress:true});Select(Parent);Set(MyPDF,Concatenate("<HTTP POST URL from Flow>&DocId=",Text(Gallery1.Selected.ID)))

• Update “OnStateChange” property of “PdfViewer1” control to “UpdateContext({ShowProgress:false})“.
• Now save and close the app.
• Go to https://powerapps.microsoft.com and play the app. Click on arrow for each document and see the document rendered as pdf.

Hope this helps someone with similar requirement.