You can help by commenting or suggesting your edit directly into the transcript. We'll review any changes before posting them. All comments are completely anonymous. For any comments that need a reply, consider emailing firstname.lastname@example.org.
We are experiencing playback issues from our video hosting provider. Please check back shortly.
1:40Tag and Component Overlays
2:53HTML in Ignition
Take topic challenge
Each component has a unique set of properties. A property is simply a named variable with a distinct type that affects something about the component's behavior or appearance.
Video recorded using: Ignition 7.7
Transcript(open in window)
[00:00] Let's look at component properties in a little more detail. Every component is inside of a window. Even the window itself have various properties down the bottom left in the property editor that we can modify. These properties dictate how the component looks and how behave inside the ignition window. So for example if I click on the window up here in the project browser, it has various properties that I could set. If I click on the real container, it has various properties that we can work with. As well as any component inside of the window. So here if I select the cylindrical tank, down the bottom left in the property editor, I can see all the properties that make up that tank. So a couple of properties here for example, there's a property called value which is the actual level of the tank. If I set that to 50, you see it fill up. Also if I go down here and set the liquid color maybe to orange you see it change on the screen. So the properties definitely dictate how the component looks and how it behaves inside of the window. The various properties here, each property has a name and has a data type. The data type can range from a string, to a boolean to floating point value, to a border, to a font, to a color, to a data set and more. Depending on the data type, you're going to bind that value to an appropriate source. So if you look at the property editor down here at bottom left, the first thing you're going to see is all the properties broken up by category. So I can see some common properties, some properties for data, some appearance properties on the tank. If I go to the meter, same kind of thing. I have common properties, data properties, appearance, and this time I also have intervals category. So I'm looking at the category view of my properties. It's possible also to just look at the properties from alphabetical order. And that we can go up to the property editor, click on the second button, which actually shows this is in alpha numeric order. So now I can just see all the properties that exist and there is no category that's implied here. I'm not a fan of this. I'd rather look at it categorized because then I can see all the different areas of properties that we can work with on that component. So if I click on a component here, just putting the mouse over it, you're actually going to see the description of that property as well as the data type. Depending on the data type, you're going to have a different editor on the right hand side that you can use to modify that property. You know, for example if it's a color, down here you're going to want to be able to pick a color from our color chooser rather than having to type a value and you know, if it's a numeric value you probably just want to type the value in or a string. So slowly, if you put your mouse over the component, you can see the description of that. You can also come up here to the property editor and click on the ShowHide Description Area, which will actually show the description down the bottom as well as the property data type. There's also up here at the top right at the property editor a filter, which allows us to filter for particular properties. Right now, I'm showing all the properties that exist. You can look at the basic set of properties which are just the simple set of properties that you use on the component to you know, to make it come to life. You have the standard set which are basically just all the standard properties that exist on that component, then there's the export properties which are more advanced properties on that component, and then if you look on all, it shows everything. So by default, we're going to see all the properties and you can scroll through the list of all the properties of the component to see exactly what that component has to offer. Now at the very end, what we're going to be doing with these properties is binding them to various sources of data, like to a tag, or to a database, or to a calculation. So that's what the binding button on the right hand side here is for. So I can actually click on the bind button to the right of the value property for the meter. It's actually going to open up the binding type where we can select the various source that we want to link it to. We're going to look at all these different sources here in the upcoming lessons. But basically, if we don't bind that property, the value will be static. It'll stay the same the way you save it in the designer. If you bind that property to a various to a tag, or to some source, the value will actually change dynamically on the window. That's how a ignition window can actually come to life. So make sure when you're looking at a project here, and looking at a new component, to click on that component and see all the properties that exist, kind of look at the description of the property, see what they do and play around with it a little bit. Change the values to see exactly what's going to happen on the screen. 'Cause once you understand the various properties that exist then you know exactly how you can configure that component ignition.