Siemens HMI Toolbox: HTML Browser

Each post in the Siemens HMI Toolbox series highlights a native HMI object in the Siemens WinCC Comfort, Advanced, or Professional environments. It is our goal to help users become more familiar with HMI development by sharing some of our best practices and useful tools we have learned.

This post focuses on the HTML Browser object.

Overview:

The HTML Browser object allows you to view simple HTML pages in your HMI runtime application. DMC has used this HMI element to serve many different purposes depending on the feature requirements for the given application. Some example use cases have included:

• Network access to various data sets
• Diagnostic tool (ex. Hardware diagnostic information is available for many Siemens devices if you navigate to the device's IP address)
• Simple way to view files which are not stored locally

The HTML Browser object can be used on screens, as part of a template, and/or on pop-up screens. In addition to the browser, there are functions which allow you to interact with the selected page (ex. refresh, back, forward, scrolling, etc.).

Tips and Tricks:

• The HTML Browser object is only available for KTP Mobile Panels, Comfort Panels, and RT Advanced starting with a 7" display
• Only one HTML Browser can be inserted per screen
• Using the HTML Browser as a file explorer is not supported (ex. C:\ is not a valid URL)
• HMI tags can be used to specify the URL--this can allow you to dynamically load HTML pages to the browser if your application requires more than one to be display at runtime (see tutorial below for an example)

Tutorial:

1. Insert the HTML Browser object on a screen.

   

2. Create an internal tag of data type "WString" for the file path (called "HTMLBrowserURL" below).

   

3. In the HTML Browser select Properties > General, select the tag "HTMLBrowserURL" as the URL Tag (leave the URL field blank).

   

4. Insert an I/O field on the screen and link to the "HTMLBrowserURL" tag under Properties > General > Tag.

   

5. At runtime, type the full file path of the page to be displayed in the I/O field.

   

   

   
   
   Learn more about DMC's HMI expertise.