Inductive Automation’s long-anticipated Ignition 8 is slated to be released in the upcoming weeks. One of its many awesome new features is the introduction of the Perspective module which creates a seamless browser-based user experience using HTML5. This new front end allows for responsive screen design that will adjust automatically to a monitor, tablet, or a mobile screen as needed.
Programming in this environment is a lot like web programming, and developers will need to learn some new terminology and design approaches to take full advantage. Here are seven new concepts you will need to familiarize yourself with to get started with Perspective.
1. Terminology
As Perspective runs in the Ignition gateway scope, it is vastly different from Vision and requires new terminology. A Perspective session is your web-browser, which can contain multiple Perspective pages, each of which can hold multiple Perspective views. These views completely replace Vision windows and templates, and are where almost all graphical and component development occurs.
2. Component Styling
Perspective views, components, icons, and SVG graphics can by easily stylized by addition of parameterized CSS style sheets that alter their appearance and behavior, completely bypassing the clunky tag parameterization styling workaround needed in Vision. This allows you to easily change the look and feel of any object in Perspective by simply editing or swapping its current style, as well as attach the same style to multiple objects to keep a consistent theme to your system. Style rules can also be attached to objects that will alter the style based on actions such as hover or selection, eliminating the requirement of mouse scripting to generate a style change.
3. URL Navigation
As Perspective runs on HTML5 and in your web browser, it is crucial that URL navigation is built-in. Page navigation is done by generating a URL for the page view, and adding any additional view parameters to the URL as URL parameters. This allows for seamless backward/forward navigation in your browser while your page parameterization is kept intact. Some built-in components such as the MenuTree and the Carousel allow for different modes of navigation if needed, and help immensely on mobile screens where clicking should be minimized in favor of swiping.
4. Docked Views
Docked views can be attached to any cardinal region of any main view page, or can be set up to be attached to all pages via shared settings for consistent page headers, footers, side navigation, and more. You can set up the corner priority (top/bottom vs. left/right priority vs. inherited from shared settings) to ensure your docks function as needed, and can even configure how the dock appears (visible, on-demand, auto) and whether or not it pushes or covers the content on the main view. This helps to mitigate issues with screen sizing during development.
5. Special Container Views
There are various special containers in Perspective that allow for various design strategies. Most of the new container types are specifically designed to alleviate issues with re-sizing components and page layouts by eliminating the need to deal with coordinates. For example, flex containers are designed in a single-column or single-row format and the components within will flexibly expand/contract as needed wherever the container is embedded. Column and breakpoint containers allow you to design multiple looks of one page depending on the size of the window (desktop vs. tablet vs. mobile), allowing for one application to be used on vastly different devices if needed, potentially saving on precious development time.
6. Message Handling
Message handlers now exist within components and views, and can be used to broadcast messages containing data to anything that is listening to that particular message, whether it be components, views, pages, or the session. Strategic use of message handling removes the need for awkward or impossible bindings, and is an excellent way to send information to other areas of the application.
7. Session Properties
Session properties are essentially global variables that persist within a session and can store crucial information or allow for information sharing across multiple pages in a single session. These properties completely replace the need for Vision client tags, which no longer exist within Perspective.
For more tips on increasing productivity with Ignition, check out our blog post 5 Tips to Improve Ignition SCADA performance.
Editor's Note
Vertech is an award-winning Premier Integrator with Inductive Automation, and as the name implies, we're awesome Ignition developers. Roger has been actively involved in the Perspective module beta testing and can get way more technical than I let him get in this article. If you're interested in using the Perspective module for mobile applications, Roger and his teammates can hit the ground running.
Thanks to Inductive Automation for the feature image.
COMMENTS