Damage Counter UI Approach

Hey there,

I’ve been looking to tackle a pet project to make a damage counter for Magic: The Gathering. First off, I know there are many out there and they are much less resource heavy but I play with two other people many times a week and have a higher power tablet. I’m basically looking to make a really visually impressive one designed for the three of us and have a bit of fun with it. I worked with UDK for about a year (in 2011) and haven’t touched anything since.

I’m wondering what the best way to go about this is, from a designer’s view. I did some searching and found tutorials on UMG, is this the best system to use? I know I’m designing a glorified calculator but I want to make sure that it has the functionality to add and subtract numbers while triggering particle effects. My idea is a top-down view of three towers, each with a floating life total and buttons that I can press with my touchscreen to add and subtract from those totals. I’d like the functionality to trigger certain events when the life totals hit certain numbers.

Anyway, enough rambling… Could anyone point me in the direction of a less-general tutorial for using the UI this way?

I appreciate all your help!

For stuff above the “Towers” can be done with a 3D Widget.

You can put “On Click” function to you mesh so when you click on it, it will do what you want.

How big are you calculations?


I’d rather stick to buttons than meshes to avoid complicating things. It’d be interesting to have the towers as fracture meshes so that they can be destroyed when the life total hits 0. To answer your second question, totals would start at 20 and I’d have buttons to add or subtract 1 next to each one, nothing too complicated.


So, following a few guides I was able to get the level to load and show a UMG interface on start. I currently have a matinee running on start as a top-down view but cannot get it to stay looped.

On the interface itself, I have all of my buttons created. Could someone teach me how to subtract an integer from a text field when I press a button on the UI? I have one text field for the life total and two buttons (one + and one -) that I need to edit the value in that text field.

I appreciate the help, thank you.

Actually, that is a backwards approach. What you want to do is have a integer variable that holds the life total, and convert that to text in the get text function you bind to the text field. Then, when you press the buttons you just do the math on the integer, and it automatically updates the display of the counter.

As for the top down view, create a new pawn BP. Leave it empty, and set it as the default pawn in your GameMode BP. Then just position the player start where the camera should be, rotated to look at the game area. This will spawn the pawn in at that position, and it will stay there.

Matinee is for doing cutscenes and the like.

Thank you Axtel, the idea about the pawn class works wonderfully! I’m not sure how to setup the blueprint integer value that you mention. Is there an example of this that I could look at in the sample files, or could you provide a picture?

Thanks again!

In the widget blueprint, simply click the ‘Graph’ button in the top right. This switches to the actual logic editor. From there, look to the left side of the window to the ‘My Blueprint’ pane. Then click the ‘+’ symbol in the ‘Variables’ tab. From there just set the type to integer and give it a name.

Here is the button I am talking about. Pardon the text, a computer mouse is not the best writing implement.


EDIT: You will also need to click the eye if you want to access the variable from other blueprints.

I appreciate the help… I’m still pathetically lost and I’m sure it’s something simple. (if this attaches properly) I have included an image of what I have set up before. I created the Player1LifeVar variable and I’m trying to get the text box on the design panel to reflect the value of that created variable but I’m not sure how to do that. The nodes seem incompatible with each other.

d397e4b825ac22885e27206a38d8adf07ad14a57.jpeg Hopefully it’s attached at this point - browser is acting weird with this site.

If it helps, here’s an image of the UMG design panel so you see what I’m trying to do. Once I get the (Player1+) button to work, the rest should be mirrors.

it looks like you need to pull something to your “set text” aka your player1lifevar 054af8765acc9c424f608d802dd8456f523a2631.jpeg

Take a look at this: All you need to do in the binding is get whatever variable you need. Then, when you update the variable, it automatically updates the text.