Welcome back, everyone. In the last video, we started to create some bindings for our various widgets here. One thing I did between videos is I made a little script just to display this skill acquired Widget Blueprint to the screen. So you can see what some of these modifications actually look like. Now, just note that what I did here, and I'll show you how I did it, what I did here is very temporary in nature. I don't want to keep this around.

But just for testing purposes here, it was worth seeing what our different texts here is all going to look like. For example, if I click play right now, you will see that my Widget Blueprint is displaying on screen right away. Of course the HUD is gonna overlap it but you can see that with the electro sparks skill acquired, this is what that's going to look like. You can see how the, the text is changed for the title and even the color of the text for the title has changed as well. So you If you want to follow along and just be able to see this Widget Blueprint up on your screen, this is what I did. Here in the level editor along the toolbar, if you come over to the blueprints button, and you open your Level Blueprint, you can create a quick test script so that you can display your skill acquired Widget Blueprint to the screen.

And all I did here is off of Event Begin Play. I just created a node i right clicked and I searched for a node called Create Widget. And it'll say construct none until you slot in your bw BP skill acquired. And then it'll change the title of this. So I created this widget, our skill acquired and then you drag off of your return value here and you type in Add to Viewport. Okay, so that is a script again, you have to have Event Begin Play preceding it.

But that's how you can get that to show up on your screen. And then what I did here is just to test it out, I went into my BP blue, sorry, my BP player blueprint. And I set my skill acquired to electro sparks so you can see what it's gonna look like for for different skills that you acquire here by choosing one of these other options. So if I choose missed, and I click play, now you can see what that missed text is going to look like and it says, learned, missed. Okay, so that's just a real quick way to test that out. I'll leave that for the time being but just know that I am going to kill that script sooner or later.

Okay with that, I'm going to jump back to our w BP skill acquired and to continue with our HUD bindings and if you don't remember how to get there, we are in a Metroidvania content Metroidvania widgets. And there's our web. BP skill acquired. So let's continue for the next binding that we want to create is going to be for our border color our skill border color, if you will, and it's called do let's see where it is over the left hand side here, skill background image right there. Okay, that's the one that we're going to be looking for. So make sure you've got your skill underscore background image widget selected.

And then over in the right hand side, where we've got the appearance, and then the brush in a sort of this goldish tint. Here's the binding right here that we want to create a binding for. So click on this create a binding, it's gonna jump us over to the Graph tab. We're going to do a lot like we did before. We're going to break this wire by holding down the Alt key and simply left clicking and then I'm going to come under the My Blueprint panel hit f2 over this function name and we're going to call this get skill, border color. Now again, just achieve here in less than that amount of time I'm going to jump over to our get skill font color function by double clicking on it.

And I'm gonna left click and drag and grab all these nodes right here Ctrl C Ctrl V. And I am going to make sure all the execution wires are hooked in. Now, truth be told, I really could plug this in like so and everything would pretty much be hunky dory with the exception that well, first of all, it's not allowing me to do that because Our data type here is different. If you jump over to our BP player, and you jump over to something like double jump data, you can see that we've got this skill, border color, and this skill font color, and they're similar in color. Although, if you jump over to the structure variable, this is getting a little off topic, but I'll bring it back. Sorry, the struct variable There's our skill data, we can see that our border color is a slate brush variable type in our font color is a slip color type.

So that is why I am not being allowed. Those are two different variable types. That is why I cannot just simply take our return value here and plug it into here. So what I'm going to do is I'm going to do a lot like I did before, and I'm going to right click on our select node here in our get skill border colored function. Right click, I'm going to break all links and first thing I'm going to do is make sure that I plugged my skill acquired into the index of the Select node. And then just like we did before, I have got to find clicking this drop down right here, this skill border color, plug that into double jump double jump data like so.

And this process is going to continue much like it did before. This is the border color for back dash. And the border color for fireball and the border color for electrical spark and the border color for Lens of Truth. It's really easy to make a mistake here if you're not standing focused, so do your best to stay focused during these tedious parts, skill border color for the mist, collapsing that back up. And now we can take our return value and plug that into the return value of our function node. Okay, so, gonna do one more of these hookups before we call this video wrapped.

The next one I'm gonna do is jumping over to our Designer tab. And I'm not going to keep testing these for each and every one of these, select your screen shot border widget over in the hierarchy, that is his border, kind of surrounding your picture. And over on the right hand side, in the appearance section where you see this little gold color, click and create a binding for this as well. Create binding. Going to create some space between these all gonna hold down alt and left click I'm going to rename this function hitting f2 on it to be get skill. border.

Not skill, border color. Get skill. Sorry, sorry, sorry, let me circle right back around skill border color. Oh, yes, sorry, you know what, this is pretty much gonna be the exact same thing. So we don't have to create a new binding for this fight, jump back over to the Designer tab, we created a binding for this color that's going to be right along the top here for a background image. So if I select my screenshot border right here, my and I come under my brush, and I started to create a function right here, I can remove this binding.

And well actually, let's do it. Let's do a duplicate of that binding that we just created. So I'm going to create a binding Here's my old one that I was just starting to create. I'm gonna delete that out. I'm gonna hit f2 on this, we'll call this get image. border color.

I'm gonna break this link right here. I'm going to select my skill border color up here, and I'm going to copy all of these nodes left click and drag, get them all Ctrl C. Then I'm going to come under my get image border color. Going to Ctrl V to paste them all. Move them down into position. And I can plug our return values straight away into here because I'm going to click this little drop down color. see we've got the border color for this.

We essentially want to have to have the exact same functions here because the border color is going to be the same whether it is for this border up here which we're calling skill BG image, or this border right here, which is our screenshot border. So that is all going to be working fine and dandy as well. I'm just going to Compile and Save here. Then I'm going to go back into my BP player let's select our skill acquired variable and I will change this to let's go fireball this time. Then I'm going to click play. And you can see how my text and my borders are all the same color which is what we want now we're not quite finished here.

I still need to make it so that our man ACOs here is variable and our description here is variable and our button input and this image, but we are making traction So guys, that'll be a wrap for this video. We We'll see you in the next one.