PDF Viewer for a better control and files selection

by Super User on ‎01-11-2018 08:13 AM - last edited on ‎01-11-2018 10:44 AM by mackenzie_lyng

One of the key features of PowerApps is the capability in viewing PDF file, either in

- Web (URL)

- One Drive or Google Drive

 

However, due to the default design of PDF Viewer, we can improve further on:

  1. Create a Button.OnSelect to resume to original FitBoth Zoom or Zoom to the size we wish
  2. Using Slider to replace the mini “+” & “-“ button to Zoom In / Zoom Out for a better user experience.

In this example, I am using PDF resides in Website and LookUp to the related PDF File listed in Excel file (and added as Static Datasource).

 

Screenshot (180)_LI.jpg

 

 

Waffle Menu + Gallery

 

A Waffle Menu & a Gallery are inserted to display the “First Character” of all the chemicals for quick selection, and appended into Dropdown.

 

Screenshot (181).pngWaffle Menu, OnSelect to show Gallery Menu

    1.  Waffle menu, OnSelect = UpdateContext({msdscode: !msdscode})

         This is to make the Gallery Visible. [Gallery1.Visible = msdscode]

 

  1. Items = Distinct(MSDS_Table, Left(Chemical_Name, 1))

Gallery1.Layout = Vertical

Gallery1.WrapCount = 6 (or others to fit the screen with better view)

Gallery1.Label.OnSelect = UpdateContext({msdscode: false}) …. To hide the Gallery after OnSelect

 

Dropdown

 

MSDS Code Listing.PNG

 

A Dropdown is inserted with

  1. Items =

          Distinct(Filter(MSDS_Table, Left(Chemical_Name, 1) in Gallery5.Selected.Result), Chemical_Name)

          Where:

          - MSDS_Table is the datasource added in as static data from Excel, with Two Columns

                 Column_1 : Chemical_Name

                 Column 2: MSDS_Code

 

PDF Viewer

 

Screenshot (182).pngPDF showned on Dropdown selectionScreenshot (183).pngDropdown is selected

PDFViewer.Document =

"http://www.sciencelab.com/msds.php?msdsId="&LookUp(MSDS_Table, Chemical_Name = Dropdown1.Selected.Result).MSDS_Code

 

http://www.sciencelab.com/msds.php?msdsId = is the original Website Link for all the MSDS, for example: http://www.sciencelab.com/msds.php?msdsId=9922768

 

LookUp(MSDS_Table, Chemical_Name = Dropdown1.Selected.Result).MSDS_Code

Is retrieving the MSDS_Code from the Datasource based on the selected Chemical Name.

 

[The data contains about 1,400 MSDS, and it is easily retrieved from browser using F12,copy the html codes into Excel, and Excel can automatically filter the numerical codes within seconds]

 

Lastly, as the default Top Bar is so small for Mobile Screen, and especially those with BIG FINGERS, further improvement will be necessary. 

 

Create FULL SCREEN button & Slider to Zoom In / Zoom Out

 

Following are the formula used:

 

PDFViewer.Zoom = Slider1.Value

 

Slider1.Min = 70 (I found my pdf file best fit at 70)

Slider1.Max = 300 (or as you wish)

Slider1.Default = zoomactual (this is a Context Variable; any name will do!)

 

Full Screen Button.OnSelect = UpdateContext({zoomactual: 69}); UpdateContext({zoomactual: FitBoth})

 

Screen.OnHidden = UpdateContext({zoomactual: 69})

Secreen.OnVisible = UpdateContext({zoomactual: 70})

Note: UpdateContext are always in PAIR, with second UpdateContext set to get the final results.

 

Final Thought:

 

I wish PowerApps group can include Pin to Zoom In / Out but I guess at the moment is not supported, so Slider maybe an alternative for a quick action.

 

The datasource for PDF files can be from

- One Drive or

- Google Drive

using ShreLink as generated in the Web.

 

Hope you enjoy my sharing.

 

Comments
by BrendonBrooksP1
on ‎02-06-2018 08:39 AM

What's the recommended file size for PDF documents so that they can be seen in the app. I'm testing a PDF that is 137kb, and I'm still getting the alert to open the PDF in the browser. 

by Super User
on ‎02-13-2018 09:14 AM

Hi

 

Sorry for late reply. In fact, I have PDF file with 200kb and up to 1mb.

It all depends on internet speed and normally when I use, even with Mobile phone, it took about < 5 seconds to load.

 

TQ

by MillerNation
on ‎02-13-2018 12:46 PM

Great but what about HTTPS?

Meet Our Blog Authors