0:16
Good morning everyone. Thank you for joining us today on this webinar on Canvas Enhanced Display Attributes in Cscape 10.
0:25
The presentation should last around 10 minutes today, and if you have any questions during the presentation, please attend the question panel and we will look into them at the end of the presentation.
0:37
That said, let’s get started.
0:40
Hello and welcome to today’s webinar.
0:42
Today we will be looking at enhanced display attributes for Canvas and Cscape 10.
0:48
Let’s look at our agenda for today.
0:51
We will start by looking at what these enhanced display attributes in Cscape 10 for Canvas are.
0:57
We will then review standard attributes for all graphics objects.
1:01
Finally, we will discuss how to assign variables to each of these display attributes that you want to manipulate.
1:08
There will be demonstrations throughout and we will finish with the Q &A session.
1:12
Enhanced Display Attributes are a new set of graphic object attributes that are Canvas and Cscape 10 exclusive.
1:20
These new attributes are in addition to the standard attributes available in all modern graphics objects.
1:26
There are six new Enhanced Display Attributes.
1:29
These are Opacity, Rotation, X Position, Y Position, Width and Height.
1:36
So when you place a graphic object on the screen for a canvas project in Cscape 10, You now have the ability to manipulate these six enhanced attributes at runtime.
1:46
Standard graphics attributes are available with both Cscape 9 and Cscape 10 and can be used with any OCS controller.
1:54
Similar to enhanced attributes, standard attributes can be manipulated and changed at runtime.
2:00
These include Visibility, Flash, Enable, and up to four different colors.
2:05
If you want to be able to manipulate any of these attributes at runtime, you will need to assign an override register, which is shown as bar graph attributes on the screen.
2:16
This override register or variable is mapped to the standard attributes as shown.
2:21
The first bit is visibility, the second bit is flash, the fourth bit is enable, and bits 5 through 8 are the four different colors.
2:29
If you see an attribute that’s grayed out on your dialog box, it means the object you are configuring doesn’t support that particular standard attribute.
2:39
For example, the dialog box on the screen has the Enable Input attribute grayed out, which means that particular object can’t be enabled or disabled at runtime.
2:49
Canvas expands the current list of standard attributes by adding enhanced attributes.
2:54
These enhanced attributes can be accessed in Cscape 10 for Canvas controllers from the Enhanced button on the Display Attributes dialog box.
3:04
From the Display Attributes dialog box, you can assign variables to the standard and enhanced attributes that you want to manipulate.
3:12
If you only want to manipulate one attribute, for example the Y position of an object at runtime, then you can just fill in an independent variable for the y-axis position and leave the rest of the attributes blank.
3:25
Another option for assigning variables to the six different enhanced attributes is to create a structured variable that will allow you to access each attribute.
3:35
So if you fill in the name of the structured variable and the type you select is from the enhanced attribute structure type, then Cscape will automatically fill in variable names for all six of the enhanced attributes.
3:47
If you only want to manipulate some of the enhanced attributes, then you will need to delete any of the attribute names that were automatically filled in that you don’t want to use.
3:58
So if you use a structured variable and you let all of the six enhanced attributes be filled in with the sub-variables from that structure, then you will have to set the values to each of those at runtime.
4:09
For example, if you only want to adjust the Y position and the opacity, then you will still have to fill in values for the width and height of that particular object, otherwise the object will not be visible because it will have a width and height of 0.
4:24
So it is important to only assign variables to the attributes that you actually want to manipulate.
4:30
For the attributes you don’t manipulate at runtime, you will see editable values on the left that show you exactly the attribute value as you’ve drawn the object in Cscape.
4:41
So all of the enhanced attributes can be manipulated from this dialog box if you haven’t assigned an actual variable to that enhanced attribute.
4:50
Now we will demonstrate some of these enhanced display attributes in Cscape 10.
4:55
We will start with this barrel loader example.
4:58
In this application, we have a barrel loader where an operator calls for either a water barrel, a gas barrel, or an oil barrel.
5:06
And once they do this, a graphic of the chosen barrel moves across the conveyor belt and then out of frame.
5:12
To do this, we are manipulating two enhanced attributes.
5:16
First, we are manipulating the exposition of the barrel so it can move along the conveyor belt.
5:21
We are also manipulating the opacity of the barrel so that the barrel is invisible on the screen until the operator calls for a barrel.
5:29
There are three different types of barrels that the operator can call, so instead of having three different barrels moving across the screen, we have just one, with an ASCII data field as the label for the type of barrel attached to it.
5:43
So both the barrel and the label are moving across the screen based on the X coordinate of these two objects.
5:50
Our barrel object is a graphic from the new clipart feature in Cscape 10.
5:54
To keep the programming simple, the label and the barrel have the exact same x-coordinate, so as we manipulate the x-coordinate of one object, it will apply to the x-coordinate of the other object as well.
6:08
We also have counters on the top of the screen to count the number of barrels for each of the three types, as well as a reset button for each of these three counters.
6:17
First, we will look at how we took advantage of the enhanced attributes for our barrel graphic.
6:22
When we go to Attributes, we can see that we are not using any of the standard attributes.
6:28
Here we could have utilized the Visibility attribute, however we have instead opted for the Opacity Enhanced attribute.
6:36
To access the enhanced attributes, we select the Enhanced button here.
6:41
We have created a variable called barrel with the type of the enhanced attribute structure.
6:46
So as we start to type barrel into the Structured Variable text field, Cscape automatically fills in addresses for all the variables for each of the six enhanced attributes.
6:57
However, for our barrel graphic, we only want to manipulate the opacity and exposition attributes, so we need to remove any variables that we don’t want to change.
7:07
So we will remove the rotation, the y-axis position, as well as the width and the height of the barrel, as we don’t want our barrel to change in size.
7:16
So we are left with the two variables that we want to manipulate, and the rest of these will remain fixed in Cscape.
7:24
So this is how we have set our enhanced attributes for our barrel graphic.
7:28
Next we will look at our label, which is an ASCII text field and is configured slightly different to our barrel.
7:35
This is because we have chosen to change the color of the ASCII text depending on what type of barrel is called.
7:41
So as well as changing the text, exposition and opacity of the label, we are also changing the color.
7:48
When we double click the label and select attributes, we can see that we decided to use standard attributes here for the color.
7:56
We have selected three different colors for our text color.
8:00
If we then look at our enhanced attributes, we can see we have set these up in the same way as for the barrel.
8:06
So we only have the Enhanced Opacity and Enhanced Exposition variables assigned for the label.
8:13
Every other attribute is fixed, so this is the setup for our label.
8:17
We will also briefly look at our ladder logic for our application, which is mainly for manipulating our variables.
8:24
Here we have the default Enhanced Display parameters for opacity, as well as the exposition for the label.
8:31
We have set up a default label of H2O for water, along with the default colour for the label.
8:37
Whenever one of the call buttons is pressed to call for a particular barrel, the barrel animation bit is set to play by going into animation mode.
8:46
We have set the opacity to 100% so that the barrel and the label will suddenly appear on the left side of the conveyor.
8:54
Then we have tied the assumed conveyor speed to our x position to create a manipulation of the x value based on how long it’s been since we called for the barrel.
9:04
Then we have some logic here to set the proper text and color for our label between water, gas and oil.
9:10
Finally we have our three counters to count how many of each barrel we called for, as well as the ability to reset these with the reset button.
9:19
So this is our latter logic for our application.
9:21
Now, let’s look at our bench setup for this demonstration.
9:25
We have our barrel loader demo displayed on our OCS screen.
9:29
When we call for a certain type of barrel, a barrel with a corresponding label attached to it will move across the conveyor belt, which is animated by manipulating the X position of the barrel and label.
9:40
We will call for a water barrel, and both the barrel and the H2O label move across the conveyor belt together.
9:47
Our water counter has also counted the barrel.
9:50
If we call for different barrels, we can see the labels of different text and font colors.
9:56
Once again, these colors are standard attributes.
9:59
If we want to reset any of our counters, we are able to do this using the red buttons.
10:05
For our next demonstration, we will use the example of a compass.
10:09
To create this screen, we imported an image of a compass to use for our screen background.
10:15
And on top of it, we placed a PNG file of a compass needle.
10:18
So everything except for this compass needle is part of the background.
10:23
We want to manipulate the rotation attribute of the compass needle, so it can rotate based on how our machine is facing.
10:30
We will double-click our compass needle PNG and look at its attributes.
10:35
We are not using any standard attributes here, so we will move on to our enhanced attributes.
10:41
As we can see, we are only manipulating the rotation attribute, So we created a separate variable called heading degrees to do this, instead of using the structure capability.
10:52
So the direction the needle is facing will depend on the value of the heading degrees variable, which ranges from 0 to 359.
11:01
So once again, the setup for this demonstration is simple, and there is very little ladder logic required.
11:07
We have our PNG graphic of a compass needle and using the rotation enhanced attribute it will be able to rotate on top of our compass screen background.
11:18
Next we will look at our ladder logic tied to the screen.
11:21
For the purpose of our demonstration we have kept our logic simple and set it up so that the compass needle graphic will slowly rotate 360 degrees.
11:31
Now let’s look at our bench setup for this demonstration.
11:34
We have our compass demo set up on our OCS screen where we have our needle graphic which is a PNG file with a transparent background and is rotating based on a variable value for the rotation of that particular object.
11:48
In a real-world application, we would have some sort of satellite connection or GPS connection tied to our logic that would tell us our heading.
11:57
In this case, we have simply demonstrated the rotation-enhanced attribute.
12:01
so there are many uses for the six new enhanced display attributes available from Cscape 10 for Canvas.
12:08
That concludes our webinar for today.
12:11
Thank you so much for listening, and the Q &A session will begin shortly.
12:25
Okay. It seems we don’t have any questions so far.
12:32
In this case, let me jump into the agenda.
12:42
I hope you all can see it now.
12:48
So the next webinar is going to be on Canvas Trends and Graphs in C-Scape 10, and the following is going to be on how to test BACnet IP and MESTP prior to on-site installation.
13:07
And if you want to participate, please register on our website.
13:11
I believe that’s all for today, thank you all for your time and I hope to see you in the next webinar.
13:19Have a nice day everyone.
