I have finished watching this tutorial: https://www.youtube.com/watch?v=7QA4N35ox4Q, and am trying to figure out how to have the image overlaying (2nd image) become hidden and replaced by a different image. I am trying to find a way so that if the health = >180, for instance, the image/sprite will become visible, and <179 will be a different sprite/image. Thanks in advance.
Try something like this:
it doesn’t have to be event dispatch binding, it could be just checking variable on tick or however you were reading the value already
you can check additional booleans like this:
similar to having multiple branches, but with select node it’s a little cleaner to read sometimes
Seeing how you have 4 images, wouldn’t it be easier to use 1 image instead, and display what is needed there:
yeah that is probably better. can use select and based on the selection input choose the correct image.
1 Like
Chances are I’m misreading this; if so, apologies.
Basically the first image would be only visible if the health float has a value of +170. When damage is dealt, and it goes to a value underneath 170, ‘120’, let’s say, the current image would be removed/invisible for the image under to be the new ‘state’ - that or a zposition update, but I feel that’d get messy. (Like it isn’t already)
Same for the other two; each image is completely separate and is almost like an animated sprite that represents how low the player is on health (The sprite/image would change depending on state. 170+ = Good, 120+ = Fair, etc etc)
The outside bar represents health. I’m trying to make it so the second picture, because it has a lower health, has a different image.
Here’s what I meant, it’s just 1 image widget which we update:
Use images with no alpha, or wrap the image in border to ge the right fill effect.
As a bonus you’re now working with percentages, meaning you can have any number of images and the healthpool size does not matter, does not need to be hard-coded and there’s no need for cascading if branches. 
If you must have cascading branches and hardcoded health values (because why not, it’s your game):
There really is no reason here to juggle 4 images, play with visibility or zOrder. But it can be done, ofc. Do tell if the above is enough. Otherwise it will be just an order of magnitude more convoluted than it needs to be, and even less flexible.
Apologies for the otherwise trivial error, but when the ‘Set Percent’ requires a target, it doesn’t seem to work; that and the ‘Set brush from Texture’. The nodes that are to go into the ‘Target’ of these always requires it’s own individual target; so on and forth. Maybe a difference in engine - I’m using 4.27. That or it could very well be something with the method of the health bar itself. I don’t understand UI/X design at all, and so something seemingly basic (If Health =>170, set Z position of ‘Image’ to 2 - but it’s not that simple unfortunately) is much more convoluted.
When you add widgets to the Designer hierarchy:
They appear as variables and can be dragged into the Graph:
So you can manipulate them. If the variables do not appear, flag the relevant designer widgets as needed:
When you nest widgets (user widgets sit inside other user widgets) it all works in the same fashion:
I have finished watching this tutorial: https://www.youtube.com/watch?v=7QA4N35ox4Q , and am trying to figure out how to have the image overlaying
I had a look and, sadly, it does not seems like a suitable tutorial for what you’re trying to accomplish. If you’re looking for the effect I demonstrated in the little animation above, consider adopting the abovementioned method instead.
Maybe a difference in engine - I’m using 4.27.
Things were easier in 4.xx → most native widgets were exposed variables by default. In 5.xx almost nothing is exposed.