This lesson is part of the Vision Components and Property Bindings course. You can browse the rest of the lessons below.

LESSON LIST

Autoplay Off

Supplemental Videos

Description

Use the File Explorer component to browse the Client computer's file system for PDF files and display the files in a Client with the PDF Viewer component.

Video recorded using: Ignition 8.1

Transcript

(open in window)

[00:00] Let's look at the last two components included within the reporting section of the component palette, the file explorer and the PDF viewer. The File Explorer component displays a file system tree that users can search through. The root directory property of the component acts as the root folder. We can see it's using this reports file path here within my C Drive. I can click on this pencil icon to edit the root directory and I'll append the daily reports folder to the path. When I close the text editor, you can see only the daily reports folder is now shown within the file explorer. I can also filter this tree by the file extension. Say I only want to show PDFs in the file explorer. I can come to this file extension filter property and set it to PDF. Now, only PDF files are shown within the component. Additionally, when changes are made to the directory, we can actually refresh the file explorer from the client.

[01:05] This feature was introduced in Ignition 8.1.14. For example, let's say this downtime report gets deleted. If I go into preview mode and right click on my file explorer, I can click on an option to refresh. We can see the refresh took out the deleted report. Now since I'm in preview mode, i'll click on this simple report. Here you'll see there is this selected path property that shows us the exact path to the file that is selected. Since the path is exposed, we can use it with the PDF viewer. The PDF viewer works by passing in a file path to a PDF. I'll go back into design mode and make use of the file path property on the PDF viewer. This is what determines which PDF we see in the component. So I can go ahead and bind this to the File Explorer selected path property. I'll do so by clicking on the chain link icon and selecting a property binding.

[02:03] Then the selected path property of my file explorer. Finally, I'll hit okay to apply the binding. You can see now the simple report is displayed in the PDF viewer. There are a couple of properties that drive the appearance of the PDF viewer. There's the page fit mode, page view mode, toolbar and utility visibility that you use to hide or show the toolbar and or the utility bar. There's a large number of customization options you can make from within the reports. Some notable ones being going to the next page, page rotations, text select, and printing. To recap a project utilizing the PDF viewer, along with the file explorer component makes it very easy to look through all your saved reports.

You are editing this transcript.

Make any corrections to improve this transcript. We'll review any changes before posting them.