- Release notes
- Getting started
- For administrators
- Designing automations
- Creating an automation from an idea
- Creating a project
- How to start an automation
- Managing project files and folders
- Connecting automations to your accounts
- Configuring activities
- Managing the activities in a project
- Passing values between activities
- Iterating through items
- Managing the data in a project
- Configuring a project to use your data
- Using file and folder resources
- Running and testing your projects
- Managing automations
- App projects

Studio Web User Guide
Document Viewer
Use the Document Viewer control to render a document and display it inline in your app. For example, you can use the Document Viewer control to display an invoice document or a receipt which may be located in various sources, such as storage buckets, entities, or public links.
AppsFile
.
If you only want to display an image, it is recommended to use the Image control.
If you are using Google Chrome, depending on your settings, the browser may download the document instead of opening it. This can cause the document to not display correctly in the app.
If you are experiencing this issue, follow these steps:
-
Paste the following in your Google Chrome address bar:
chrome://settings/content
-
Scroll down to the end of the page and select Additional content settings. A dropdown selection opens.
-
Select PDF documents.
-
Select the Open PDFs in Chrome option.
- Source - The source of the document you want to display. The supported file types are images (
JPEG
,PNG
,BMP
,GIF
, andWEBP
). - Hidden - If true, hides the control at runtime.
- Disabled - If true, disables the control at runtime.
-
Control Alignment - By default, inherits the parent alignment. A different alignment other than the parent can be set. To default back to the parent alignment, deselect the overridden options.
Note: The alignment is dependent on the layout selected for the parent (Vertical vs. Horizontal). -
Border - The border for the control. Border Thickness, Color, and Radius can be configured.
-
Margin - The margin of the control. By default, a margin of 4 px is set. Top/Bottom and Left/Right margin properties are combined. These properties can be detached using the Link button at the right side of the Margin section.
-
Size - The width and height of the control. By default, the size is set to
auto
, which means320 x 410px
. To set minimum or maximum values, select the three dot icon (...).