Version:

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

LESSON LIST

Autoplay Off
Take topic challenge

Supplemental Videos

Description

Learn about the Dashboard component, a flexible component that allows users to configure their own custom screens from a Perspective Session.

Video recorded using: Ignition 8.0

Transcript

(open in window)

[00:00] In this lesson, we'll take a look at the Perspective Dashboard component, a special component, with some pretty unique features. The dashboard component allows users to design their interface from inside the session using widgets that you provide. So to see what I mean here, I have a session already open with the dashboard component on it. And for right now its not too exciting, its just a big empty space, but at the bottom of my big empty space, I have a little pencil icon. And if I click that icon, that will put my dashboard into the edit mode, meaning I can now customize how my dashboard should look. To do that, all I have to do is select one of these rectangles and click that plus button and I'll be prompted to add a widget into that slot. Now for this example, I've set up two widgets already. So I have a map widget and a table widget. So how about I add a table widget here. So I'll select table and then say 'add'. And what that'll do is it'll slot that widget into my grid. Now a widget as it pertains to the dashboard component is basically just a dressed up view. And we'll be taking a view at how we can create widgets in just a bit. But for now, now that I have this widget in here, I can use the anchors to resize it if I like, I can make it bigger or smaller or I can click and drag to make move my widget around. So maybe I'll move my table widget to the left hand side and make it take up the full vertical space of my session. And then maybe on the right hand side I'll add my other widget, so I'll click that plus icon select map, and then click add and then I'll resize my map to be just a little bit bigger and then once I'm happy with where my widgets are I can click the little play button and now I'm just using the dashboard as an end user. So its important to keep in mind here again I am not in the designer right now all of the design work that I've just done took place within a perspective session. So the dashboard can be a great choice if you're trying to give your end users control over what they see of if, say, you want the supervisor to be able to control what their operators see. The dashboard component can give you that option. Now that we've seen how our dashboard component plays out in a real session, lets look at how this component is set up in the designer. So I have my designer open right behind here. And this is the view we were just working with in the session. So we can see our dashboard's properties on the right hand side here. And there's one in particular that I'd like to take a look at, which is this available widgets property. This is where we can figure the list of widgets that are available in that add widget menu. So if I expand one of my widgets here each widget is just looking at some perspective view. So the first step behind creating a widget is to create a view with the information you'd like to have on it. We also have the ability to pass parameters into the view. We have default and minimum size options. So my min size property is going to specify how small I can make this widget In terms of rows and columns. And after that I can put my widget into a category, I can give it a name, I can customize it's header, and so on. So before we dive too much deeper into the settings let's try creating a third widget here. So I'm going to collapse that widget. And then, under available widgets, I'm going to click that little plus icon to add another element. Now this time I'm going to add an alarm status widget into my dashboard. In fact, I already have a view set up for this. So under view path, I'm going to select alarms and the click 'okay'. I already have the alarms view up so lets take a look at it here. My alarms view is pretty simple, it's just an alarm status table, showing all the active alarms in my system. There is one thing special about this view though this view takes a parameter called configuring, the name on that is very important as we will see in a second. And all that does is, when you set it to true, there's a drop down component appearing up at the top that allows you to select and filter on a specific machine's alarms. So the reason that I've added this is because of some very specific functionality built into the dashboard. So if I go back into my dashboard view, here and then I select my dashboard that widget that I had started on has an 'isConfigurable' property and I'm going to go ahead and set that to true. What that's going to do is its going to allow me to toggle that configuring parameter from my dashboard so we will test that out in just a moment. Everything else in here, I'll leave pretty much alone except I'll make sure to I've my widget a name. So I'll call it alarms. And then I'll go ahead and save my project. Next let's go back into our session and see our new widget in action. So starting fresh again, I'll go ahead and select the cell then select that alarms widget and click add. Next, ill go ahead and make it a little bigger. And we can see that unlike before, we have a little pencil icon up at the top. What it's actually going to do is pass a value of true onto that configuring parameter. Which again I've set up to control visibility on our drop down here, and allow us to select a specific machine. And if I unselect that pencil icon, the setting will actually stick. So now I'm only seeing machine 8's alarms. And now if I toggle back out of edit mode here that setting will stick in my real run time as well. So effectively that 'isConfigurable' option has allowed us to configure an alarm display for any one of our machines. So this concludes our brief overview of the dashboard component. Obviously, there are a lot of settings here we didn't really get into and we encourage you to check out our user manual for more info.

You are editing this transcript.

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