Welcome back.
Now, the next step for us is to start showing things in our spell menu.
In particular, when we open it up, we should show which abilities we have equipped.
Now we have an equipped abilities row down here and we also have our two trees, the offensive and passive
trees.
Now the offensive abilities tree is using a specific widget for each globe.
Well, actually our passive and equipped abilities rows are all using the same globe.
But the truth is the equipped abilities row down here is going to need to be different.
It's actually different enough to require its own completely different widget for these globes because
these ones up here are going to show information and allow us to select them.
We're going to select by clicking on them and be able to spend points on them.
But when we click on these globes down here, that's going to mean something different.
We're going to not be able to upgrade abilities down here.
Instead, we're going to be able to click on these to select slots, to select the inputs that we'd
like to assign these different abilities to.
So they're different enough to require a different widget.
So our equipped abilities is not going to use the same globe.
Let's see what that globe is.
If we go to UI spell globes, we have a spell globe button and that's what we use in our trees.
We also have the spell globe, which is the not button version.
That's what we see here in our overlay.
Those are not buttons.
We can't click on them.
I'm going to set my number of players to one there, but our spell menu globes are buttons.
That's why we have two different ones.
We also have a value globe whose function is solely to show an integer value.
So that's kind of different.
We're now going to need a different globe button, and rather than mess with inheritance, I'm just
going to duplicate my spell globe button and make a different version of it.
It's going to be different enough to require its own widget blueprint, and we're going to call this
equipped row button.
We'll have an underscore before button.
Now, equipped row button is what we'll use in our equipped spells row.
So let's go to UI spell menu and we'll get that equipped spell row widget and we'll go ahead and replace
these.
So I'm just going to go ahead and take my spell globe buttons, all of them, and just highlight each
of them and remove them.
And then we'll go ahead and get our new equipped row button and we'll drag those in instead.
So we have a rat box offensive with a box lab that has text lab in it.
We want to drag our new equipped row button onto that box and we'll get it there.
Now, its size should be different.
In fact, we might have wanted to see what the size was before, so I'm just going to Ctrl Z until I
get this spell globe button.
I'm going to see its properties here and I see that its width and height are 60 and its glass padding
is four.
Okay, cool.
We can use that size.
So I'm going to go ahead and just remove each of these again, bring in an equipped row button onto
box one, select it, set its box width to 60 box height to 60 glass padding to four.
And it's now the size I want.
I'm going to go ahead and copy that.
Now.
I skipped lab and R&B so I can just take the boxes box lab, select it, paste and it goes right in
box.
R&B, same thing.
We already got one.
We'll do it for two through four.
So here's two, here's three and here's four.
And of course I forgot to check the size for the passive ones, but I think they were something like
40.
I'm not sure.
Let's just wing it here.
I'm going to get my vertical box passive down here we have text passive and then a rat box with a spacer.
I'm going to control V.
And click the rack box and control V again and drag the spacer between the two.
And we have two.
And I'm going to set their sizes to 40, 40 and 4040.
I think that's looking good.
And their padding can be three, 3.5 even and I think that'll be just fine.
So now we're using our new classes.
Now the reason for this is because we need a way to handle the ability info that comes in and things
are going to be treated a little bit differently.
For one, we're not ever going to have the locked icons on here.
These are going to be set to cleared with no background and no icon until an ability has actually been
broadcast.
And we'll get to all of that.
For now, I just want to let's save all.
And see if I can broadcast.
All of my ability info so that my equipped abilities row can at least show I want to see my left mouse
button ability right there.
That's all I want to see.
And if I take a look at my c plus plus classes, I'm just going to close all tabs and go to spell menu
Widget Controller.
Here's broadcast initial values here.
I can broadcast my ability info with broadcast ability info that comes from now our Aura widget controller,
which does all the stuff we've already iterated over.
This is going to result in broadcasting ability info.
Now in the spell menu widget controller.
We can use it here as well.
So now that I'm calling that, I'm just going to close the editor and we're going to broadcast ability
info here.
So compiling and launching the editor.
We can go ahead and open up our equipped spell row.
Now, each of these uses our equipped row button now.
So if we go into equipped row button, we can go into its graph.
And we're doing a couple things here.
We're getting our widget controller and casting to overlay widget controller, but actually we don't
want to use overlay widget controller anymore and we don't need the variable BP overlay widget controller
either.
I'm just going to delete that.
What we need is our spell menu widget controller instead.
Now equipped spell row could go through and set all the widget controllers for each of its children,
making sure they all have their widget controllers set.
Because if it does that, then they can have a chance to bind to that delegate ability info delegate.
So our equipped spells row should do that, and that means each of these should be named appropriately.
So this one can be called we'll just call it Globe Underscore LMB and we'll just call these each Globes,
even though they're globe buttons.
But that's okay.
This one will be Globe R&B.
This one can be globe one.
And we'll continue renaming all of them.
This one is to.
This one is three.
We have four and we have the two passives.
So I'll just call this one globe passive underscore one, and this one will be globe passive underscore
two.
So now that we have them all named, we can make sure they're all variables by holding shift and selecting
them all.
And checking is variable and back in the graph we can set them all.
We can set all their widget controllers.
Now the equipped spells row really could set its own widget controller or the spell menu could set its
widget controller.
Now the reason for the spell menu to set its widget controller, allowing it to set its child widget
controllers is that we can control the timing of things here.
You see, as soon as we get the spell menu, widget controller and set it here, that can cascade a
chain reaction of all child widgets setting their widget controllers.
And then after all that, we can broadcast initial values.
And that's exactly where broadcast ability info will happen.
So what we want to do is make sure all widget controllers are set before broadcast initial values happens.
That means here in the spell menu widget controller, we can take our equipped spell row and set its
widget controller here.
So I'm going to check is variable for it.
Come in here and.
Grab equipped spell row.
Call Set Widget controller.
And pass in widget controller.
We know that widget controller will be set now because we're calling set widget controller.
And now the equipped spell row will have its widget controller set and as soon as that widget controller
is set for equipped spell row, then equipped spell row can have its widget controller set event set.
Right here we can implement widget controller set event.
And once that's set, it can now set all of its child widgets globes one through passive to.
I can set their widget controller so we can take globe one, grab it, call set, widget controller.
And we know that widget controller is set so we can get widget controller.
And we can set it.
Right here.
So I'm going to move widget controller up here so we don't confuse it.
Actually, I'll put it right there and then we can set to through passive to all the rest of them.
So let's time lapse that.
Okay, so we've now set the widget controllers in widget controller set.
So now all of its child globe buttons will have their widget controller set as long as it has its widget
controller set.
I'm going to collapse this to a function called.
Either set widget controllers or we could call it set child widget controllers either way, but I'll
call it set widget controllers.
And now this will have its widget controllers set.
And as soon as their widget controllers are set, they can then assign an event to ability info delegate.
So what we can do is we can get widget controller.
We can cast it to spell menu widget controller.
We'll use the BP version.
We can promote that to a variable BP.
Spell Menu.
Widget Controller.
We can comment this set widget controller.
We'll say set spell menu.
Widget controller.
Put that up here.
Add a sequence.
And then we can take BP spell menu, widget controller and use the ability info delegate.
We can assign that.
And what do we want to do?
Well, we want to set our ability icon right, based on the info that comes through.
We can break that struct.
And we can see what its ability tag is.
Now, here's one of the differences between the equipped row button and the other buttons in the spell
menu.
These ones in the spell trees.
When ability info is broadcast, these buttons down here need to check the ability info for its input
tag.
They need to see if it's LMB, R&B or whatever.
They don't really care what the ability is.
They care about the input tag, but the spell trees don't care about the input tag.
They care about the ability tag.
The ability for Firebolt will always be this one down here at the bottom left.
It'll never be this one or that one.
We won't be able to reassign their position in the tree.
We'll only be able to reassign their input down here.
So that's why these are different.
And their implementations of their events that respond to the delegate broadcast will be different.
The equipped row button is going to check input tag, which means it needs its own input tag variable.
We need to add a variable called input tag.
It needs to be a gameplay tag.
And I'm going to check the eye icon, make it instance editable and in equip spells row.
We're going to set the input tags for all of them.
So we'll just do it here in the details panel.
That way they have default values and we won't ever change them here.
This one will be.
Input tag lab.
This one will be R&B.
This one will be one.
And to.
Three.
For.
And then, of course, our passives.
Now we don't have input tags for the passive abilities, do we?
So we'll make a note to add those before we wrap up.
In this video, we'll make passive one and passive two.
So now that these have their input tags set, then our buttons can check the ability info.
When the broadcast is made, we can take that input tag, we can call matches, tag check, exact match
and check to see if it matches our input tag.
If it does, we'll have a branch, we'll hook it up and we can update our icon and background material
so we can take image icon.
And call.
Set brush.
And we can even call, set brush from texture and take the icon and hook it straight in.
There we go.
And we can also take our image background.
Call, set brush and we can even call set brush from material.
And we can pass in the background material.
And with that.
We can compile, we can save.
We can launch, we can open the spells menu and nothing happens because we need to go into the spell
menu.
And as soon as those widget controllers are set, we need to broadcast initial values and then that
ability info delegate will be broadcast.
So what we should do when we set our spell menu widget controller is our spell menu should cast it to
spell menu, widget controller blueprint and promote it to a variable.
It doesn't have to cast it to the blueprint, but I like to just in case we add things to the blueprint
that we need.
So what we'll do is we'll do that cast real quick.
So take spell menu widget controller that we get.
Cast a spell menu.
Widget Controller.
Like.
So we'll promote it to a variable.
Called BP Spell Menu Widget controller.
Now we have that.
And we'll just use that here.
And we'll have different steps for each stage.
We'll have this part where we're setting the widget controller.
So we'll say set spell menu.
Widget controller.
After that, we'll set the widget controllers for the spell menu itself.
In fact, we should have it set its own widget controller ASAP.
Right up here.
And then the next step will just be setting all child widget controllers down here and we'll eventually
collapse that to a function.
But for now, we'll just say.
Comment set sub widget Widget controllers.
And as soon as we've done that, we can broadcast initial values by taking BP spill menu, widget controller
and calling.
Broadcast initial values.
Hooking that up.
Commenting it saying broadcast.
Initial values.
And now that we're actually broadcasting those values, moment of truth, let's see if we can see.
Our ability and we can and it works.
And we can even go into that ability and change its default input to, say, one of the other inputs.
Let's go, let's just do that real quick just to see we'll go to ability system, aura abilities, fire
Firebolt Firebolt and we'll change its default start up input tag here.
Start up input tag.
Well, let's change it to for.
And it's way over there at four and it's way over there at four.
Excellent, excellent, excellent.
So last couple things to do.
One is we need to add a input tag for passives one and two, just so we can identify them by their input
tags, even though we won't be pressing input to activate them necessarily, we'll still use that to
identify them.
So that's one thing we have to do.
Another thing I want to do is to make our equip spell row globes empty by default.
So I'd like a convenient function that will set their icon and background render opacities to 0 or 1
like show and hide them.
So a nice, easy function to use for that.
And then we'll hide them by default.
And we'll show them when we set them.
And that way, if we reassign an ability from one to another, then we can set it back to empty looking.
So what we'll do is we'll have just a clear and an unclear I suppose would be good function names.
So we'll just have right here an event pre construct just after updating box size and actually I'm in
equip spells row.
Let's go to the button itself equip spells button.
We will collapse that to a function later but in pre construct here let's clear things.
We're going to have our image background and our image icon.
Those are both variables.
So we can take image, background and image icon.
And I just want to functions on and off, clear and unclear.
Clear and show.
I guess so.
We'll have image background.
We'll call set.
Render opacity.
And it'll be zero.
We'll call set render opacity for image icon.
Passing in zero.
Right.
So if we compile by default, it's empty.
This will be the function called Clear icon or Clear globe.
We'll call it Clear Globe Collapse.
The function Clear globe.
We already made that clear.
Globe clears the it sets the image background actually to the transparent brush.
So since we already have that, we could just use the clear globe function.
So this new function, I'm just going to use this.
The clear globe was setting the brush to the transparent brush.
I suppose we could either do that or we could set the render opacity.
Setting it to the transparent brush seems kind of convenient.
So I think I might set image, background and image icon both to the transparent brush.
And we'll delete that new function.
So back up here.
We don't need the new function.
We'll just call Clear Globe.
And now that we're setting the brush to a transparent brush, every time we update the brush, we have
to actually call set brush because set brush from texture will change the texture of the brush.
But if it has that transparent brush, then it'll still be transparent.
So instead of set brush from texture and material, we're going to take Image icon and just call set
brush.
We'll do the same thing with image background.
We'll just call, set, brush, hook those up to true.
And what we can do is make a new brush we can drag off of in brush.
We can make a slate brush.
And for our icon, we're going to use the icon.
So I'll drag the icon into the image here.
And for the image background, we'll use make slate brush.
And for this one we'll use the background material for the image.
And we'll hook that up to that and that's going to work.
Let's go ahead and press play.
And there we see everything else is empty except for the one ability we have.
And I'm going to go to GA Firebolt and set its input tag back to Lab.
So there it is.
Opening spell menu.
There it is.
Perfect.
So this stuff here, when our ability info delegate event is received, we can collapse this to a function
for our equipped row button.
So let's do that.
We'll call it.
Receive ability info.
And it's all nice and tidy right there.
And the comment will say receive ability info.
Beautiful.
All right.
So that does basically everything we needed to do in this video.
We're now finally receiving some data in our spell menu.
The last thing I'll do is I'll just close the engine, go into our aura gameplay tags, CPP and header,
and we'll make two new input tags for the passive abilities.
I'll just copy LMB and R&B and paste them down here.
Call these input tag passive underscore one and we'll have input tag passive two.
And we'll go ahead and make these.
Let's go into.
The CP.
Find our other input tags.
And we'll just go ahead and make two more.
So copying two of them, pasting them, this one will be input tag, passive one, and its name will
be input tag passive dot one.
And it'll say input tag for passive ability one.
And then we'll have input tag passive two.
The tag itself will be input.
Tag passive too, and then we'll have input.
Tag for passive ability too.
We don't need three even though our spell menu has three and the passive spell tree.
But those won't be using input tags.
Those will be using ability tags.
Only our equipped spells row, which only has two globes for passive need passive one and two.
So we can just compile launch the editor and we can go to our equipped spell row and make sure those
two globes have their input tags set.
Okay, let's go ahead and open a quip spell row, select this passive globe type input tag or just input
and set its input tag to input tag passive dot one and this one will be input tag dot passive dot two.
And now all the input tags are set.
Things are starting to look really nice.
If we take a look at our spell menu, at least our equipped abilities are showing when we first open
our menu our equipped abilities and we only have one.
Perfect.
Excellent.
And really, really quick.
I know I've been doing these little tweaks here and there, but I'm noticing my equip button is taller
than my spin point button.
I'm just going to really quickly change that.
So back to my spell menu.
Here's my spin point button.
Its height is 60.
I'm going to make this equip button.
Also have a height of 60.
It was 65.
So not a big change, but something I wanted to do.
Okay.
Great job.
I'll see you in the next video.