I have some UI elements animated and exported into a sprite flipbook. Is there anyway I can use this in UMG? I’m currently just parenting it to the player camera’s blueprint, but this leads to some weird graphics effects when moving the camera around. Alternatively, is there a way I can simply add it to the viewport?
Many thanks!
You would have to use a material to animate a texture with subuvs, UMG widgets don’t understand Paper2D’s flipbook asset.
Cheers,
Nick
Any chance to see this fixed in 4.7? Us paper2d guys need to feel that you love us as well Nick! 
Probably not; it’s not a trivial change to make and there are too many other higher priority things. would probably need to do it, as it will I believe require moving some paper2d types into the core bits of the engine. To make them accessible to the slate rendering pipeline for UMG.
Hello there,
I’m confused because I’ve been able to add a simple flipbook to UMG and it worked (added to the viewport) then I’ve tried the next step (which is what I really need) assigning the UMG (with the flipbook) to a 3D widget but nothing shows up.
Nick: would it be possible to get an update on what is currently working and not working please ?
(I’m not sure if I’m doing something wrong or If there is no way it’s going to work)
Hey,
Did you use a material for the flipbook or literally the Paper Flipbook itself? Would love to know how you’ve set that up, as I’ve had to resort to just dropping the flipbook actor into the scene and parent to camera. Been able to get a flipbook material working as an image, though haven’t tested with 3D wigets themselves.
Hello,
I’m working on a 3D project and used flipbook only once for this test so pardon me if my explanations are not very clear.
Disclaimer: I don’t know what is a paper flipbook, is it the same as just a flipbook texture ?
What I did is create a flipbook texture, made a material out of it, checked things like “used for UI” for example to prepare the material…then assign the material in UMG and it worked.
But it only works in viewport, I’ve been unabled to make it work as a 3D widget.
Hope it helps.
When I need looping animations in my widget I just create and image and a Macro in the graph that loops a set of textures in the brush properties of the image.
Wait, so there is a way? Sounds simple enough but a few things are unclear…which graph would you place said image and macro? Brush properties? Could you give an example please or point me to one please? That sounds like exactly what I’ve been looking for for the last few days and I’m stumped…
I don’t know if it’s the solution you are looking for, but I ended up using Materials that had the Flipbook material function in them instead. Very easy work-around to get image sequences working well in UMG!
Additional info: Render a Flipbook Animation | Unreal Engine Documentation
Hey guys, I’ve hacked together an AnimatedImage class for doing spritesheet animation in UMG: UMG Animated Image. · GitHub
hi, I created a plugin that can support use flipbook directly in UMG.
You can find my plugin in marketplace:
You can try HorizonFlipbookWidget in this plugin.
cheer
Nicely done! Does it include source? Is it ok to modify it?
yes, if you buy the plugin you can get source code, and it is ok to modify source for your own project if you want.
And it works beautifully. Highly recommended.
Wanted to add jittery text label, seemed way to complicated until I tripped over this post.
I am also experiencing this problem now. After one year, I would like to ask if there is any good liberation method?
Elegant Solution - C++ (Easily expandable to Blueprints)
1 - You can put in UPaperSprite objects directly into any UImage.So ultimately it is possible
2 - You just need to simulate the UPaperFlipbookComponent Tick(or use the Component itself and call TickActorComponent() wherever you want.Don’t have to attach it to an actor)
Here’s the c++ snippet I use
FDateTime AnimStartDate;
UPaperFlipbook* AnimFlipbook;
UImage* AnimImage;
void StartAnimation()
{
AnimStartDate = FDateTime::Now();
}
void TickAnimation()
{
FTimespan sTime = FDateTime::Now() - AnimStartDate;
float sSeconds = sTime.GetTotalSeconds();
//Animation is done
if (sSeconds >= AnimFlipbook->GetTotalDuration())
{
//Loop
{
AnimStartDate = FDateTime::Now();
}
//Or End
{
//Do end logic
}
}
else
{
AnimImage->SetBrushResourceObject(AnimFlipbook->GetSpriteAtTime(sSeconds));
}
}
Very easy to accomplish.If you need more control over how to animate, you can check UPaperFlipbookComponent to see how they change the play rate.Or directly use the Component to tickand register the correct frame to put into the image
Try this, not fully tested but anyway…
FlipbookImageWidget.cpp (6.3 KB)
FlipbookImageWidget.h (3.3 KB)
All data for animation is gathered directly from the flip book asset.
Great solution. I actually inherited from UImage to try this out and it works. Probably taking an emptier UWidget, but I’m already glad that this works! Thanks!
