[00:00] In this lesson, we'll talk about images in the Perspective module. I'm classifying images as PNGs, JPGS, those rasterized images that you want to show on your Views. If you're familiar with Vision, you know that you can go up to your Tools menu, and open up Image Management. And if you're unfamiliar with this tool, we simply store these images on the Gateway, but you have access to them here. You also have some built in images when you first install Ignition. But of course, there's an upload button here, so you can add images if you need to. The supported types are listed down below. Now, in this case, we're going to head over to the built-in, so I'll start double clicking. I'll go to this Agitator directory. I'll double click again. And I'm going to use this first agitator here. So, I'm going to right click, and copy the path to it. Which places the path to this image in Image Management, into my system clipboard. So, we'll copy the path here. And I'm done with Image Management, I'm simply going to close this. Now, to get that image on to my View, we'll primarily be using the Image component. So, if I head over to the Perspective Component Palette, under Display, there's an Image component which I'll drag on to my View. And then, to show the image, we need to update the Source Property, here. Now, you can see from the Tooltip, we need an image URI. We'll talk about that a little bit later, though. So, right now, to use the Image Management stuff, I simply need to change the value of source. So, if I head over to the Value, I'll right click and I'll paste. It will paste the path to that image, but you won't see the image yet. To access images in Image Management, you need to make a slight modification to this path. I'll click back into the source field, here. I'll move my text cursor all the way over to the left, and then you type /system, /images and then one more slash and you can see that the image appears right away. Now, at this moment in time, you need to type system/images, which may change in the future, always consult the User Manual for more information. Now, while I have this Image Component here, you'll notice that as I resize the component, the image doesn't stretch with it. And that's mostly due to these Fit properties here, specifically Mode. The Mode property determines whether or not we should resize the image. So, if I click the little drop down here, I could set it to Fill, which will cause the image to fill the entirety of the component. Now again, we're working with these rasterized images, which don't necessarily handle being resized too well. I think I'll set this back to None, and use just the original size. Now, let's grab another image component. So, we'll head back to the Perspective Component Palette. And again, back under Display. I'll grab an image and throw that on to my View. Now, from the tool tip we saw earlier, here, Source allows us to grab a URI. And again, we're dealing with a web based solution here. So, if I can grab some sort of web address we can simply point the component to an image over the network somewhere. Now, I'm going to move my Designer out of the way, here, and head over to one of my favorite websites. If you have an image stored or available somewhere, such as this one at the top, I can right click on it, and I can copy the image address to it. So, again, just to kinda show you. If I go to a different tab and I just kinda paste that in there, we'll hit Enter, and you can kinda see that it shows the image, as well as the path to it. We can actually use that URL up there, inside of our components. So now that I've showed you how to steal these images, let's go ahead, we'll head back to our Designer. And I have my image component, my new one, selected. I can simply click into this field. We'll go ahead and actually, we'll right click. We'll paste, and you can see the image is now available inside of the component. Now, technically, this last little trick I just showed you here, with using an actual web address, that would also work with SVGs. So instead of using the methods described in the SVG video where you just simply drag and drop, you could use an Image Component and point it to an SVG hosted somewhere on the network. As a closing statement, it may or may not seem obvious, but always respect applicable copyright laws when using images you find online.