PLEASE HELP! Animated UMG Hud

Development Programming & Scripting UI
, , , , , ,
1

There is SubUV support but it’s only used in particule system, you would need to create material that will animate your SubUV animation and do widget with Image Widget that will animated

But… why not just use UMG animation tools? I mean the entire system is called Unreal Motion Graphics for a reason, animation suppose to it’s spotlight feature as even raw Slate don’t provide that. Here you have some tutorials:

https://docs.unrealengine.com/latest/INT/Videos/PLZlv_N0_O1gYdhCvvMKGpCF6LCgBz9XeS/FiPRjFe7Y-c/

You can animate lot of appearance variables with it. Slate and inherently UMG supports Scale and Rotation transformations of widgets so there should not be technical limitation for what you want to make ;] I just check and you can animate transformation.

Now only issue will be the frame, for that you can either make material that animates on there own using “Time” node or as i said above make a widget that will animate the image, either by material parameters or swaping image widgets you can make seperate widget just for that (note Widget Blueprint is UMG widget and one widget can contain another one).

I myself use UMG animation in recent MageJam for the first time im more of a plugin guy ;p) and i was positively suppriced how smooth it works. Also thinking about it doing animation you trying to do in perticilar doing frame by frame is just waste of memory looking on what you can do in UMG.

2

Hi!

I have a noob question. I am trying to make a timed game and most of it is completed. However, I want there to be a “3, 2, 1, GO!” graphic on my UMG hud widget before the player gains control of the player object. I created an animation sequence in Adobe After Effects and exported it as a series of PNGs. I then made it into a sprite sheet that I could use as a UV animation.

Unfortunately, nothing has presented itself on the internet when I looked for help. How can I make an animated series of images appear on the UMG hud?

Thanks!
-Jack

Post Scriptum , here is the sprite sheet.

221053-spritesheetcountdown.jpg
221053-spritesheetcountdown.jpg2000×2400 568 KB

3

Also, here is a GIF of what it should look like:

221054-spritesheetcountdown.gif

4

Hey, you could try this:

  1. Make a new material, change it to ‘user interface’
  2. Use Flipbook node, hook up your texture there, rows, columns etc.
  3. Open your Widget. Create an empty image.
  4. Texture it with the material you created.

You can specify a specific frame or start or end by using for example material parameter collections. By default it will just loop.

It’s better to do it 's way, though, if it was to be as simple as the gif you posted.

5

Thanks, gstyczen!

I will try that out and see if that works. For future reference, I will post it here.

Thanks again for your help.

6

Okay. For posterity, here is my solution in step by step format:

1: I created a material, set the material doman to “User Interface”, and set the blending mode to “Masked” (to get rid of the key background).
2: I added in the UV texture and hooked up a Flipbook node.
3: I attached constants to number of rows and number of columns
4: I attached the following equation to the Animation Phase node: “Time” Input Data * material constant (in my case, 0.3).

The most important thing to remember is that the material expression constant is roughly equal to one hundredth of FPS. For example 30 frames per second would be 0.3.