Download

Not Loving Blueprints for UI Logic - How Best to Deal

Full disclosure, I’m a total UE4/C++ noob but a pretty advanced web technology and JavaScript developer and at least semi-fluent in most popular web server languages.

I’m liking UMG’s visual editor but is there a way to tweak things at the code-level? I think what I’d like to be able to do is to simply drop UI elements in where they can be arranged and styled and have identifiers set on them but then have them all wired into some sort of universal event dispatcher whose messages they would act on or ignore.

Could I create some sort of superclass for the existing UMG UI elements maybe?

For something like MMO UI with commerce, user chat, abilities, leveling, inventory, customizable/dockable widgets, etc… I’m definitely feeling like I’d be hitting a spaghetti mess pretty fast with UMG blueprints but I want the convenience of the visual editor and slate’s looking a little granular for my current needs (but I plan on digging into it eventually).

At the very least, just knowing where to look for the source code for the prebuilt UMG widgets would be (potentially) helpful, assuming that’s exposed somewhere.

To see the source code for those widgets, you can check the API reference out:

https://docs.unrealengine.com/latest/INT/API/Runtime/UMG/index.html

However If you’re like me and are more comfortable diving into the code files themselves in VS or something, then go and get the source code form GitHub, and then you can easily go through all the source code that you’re interested in.


That all being said, considering your background, I should mention, UI in games or generally software, isn’t handled particularly similar to web pages. The closest one I know for games that has a more simplistic approach and is more artist-friendly is Scaleform, but even using that would be quite different than the more open approaches that one uses in a web page/app.

My point is, while it all might seem a bit weird at first, give it some time and use it as it was supposed to be used when they designed it, at least for a while, once you get used to its workflow, you’ll see that the logic is not that different and is actually much more manageable for a game/software, than the more open approaches that you used before. At least that’s how I look at all this.

besides, if you try to use a more procedural method and encapsulate your widgets whenever makes sense, it doesn’t take long that you see the whole code you write can actually be arranged pretty well, without making an spaghetti mess as you called it. It might take a bit of extra time at first, but it definitely saves you a lot of headaches. That’s what I do when using BP in general, but especially in things like UMG or BP events.

I agree with what Farshad12 said. I also came from a programming background and have used UDK with Scaleform when they started supporting it in 2010. When I saw BP at first I was like “How is this viable at all?”, but then I when looked at a couple tutorials and started diving into it that it was only a matter of time before I realized how awesome it was. Personally, my game will probably be 85% BP, and 15% code. Everyone’s mileage will vary.

Some of that was a little off subject, but for your MMO UI I think Scaleform will be a good choice. You’d like it because you get to use something creative and at the same time code events like you were saying in ActionScript. I remember the tutorial that I went through a few years ago to get a basic main menu going in Scaleform and it is more tedious than probably just doing something solely in UE4 is, but the result is really nice looking.

Anyways that’s my input. :slight_smile:

Do bear in mind that UMG is effectively Slate, with more visual editor support. The underlying system is the same - UMG is simply creating a specialised SWidget subclass, hence UserWidget.

As an aside - its entirely possible to subclass UserWidget in C++ and implement event handlers there, then bind those using the UMG UI:

You mention concerns re spaghetti code - I’d advise trying to get out of the headspace of a centralised event dispatcher, or trying to do everything for your UI inside a single Widget Blueprint.
Create Widget Blueprints for each of your user interface elements, and nest them, and this will help with keeping your spaghetti to a minimum. Try to use Interfaces or inheritance wherever possible so you can leverage polymorphism as this will simplify your implementation further. As an example, for docking support you could subclass UserWidget as DockableWidget, and implement docking handling there, and use that as the base class for any other widget you want to use docking.

Look through the Github source for classes having the prefix S - this indicates slate widgets.
I used Scaleform extensively, working on UI implementation within UDK for the better part of a year, and while the fact UE4 uses C++ would make integration easier, I’d argue that having to deal with the additional Actionscript VM and communicate with it makes things far more complex from an implementation perspective, especially compared to how slate uses TAttributes to do simple delegate bindings. There’s also the licensing costs to consider - Scaleform was free to UDK users, but not so with UE4.

Wow thank you for your input, I did not know that Scaleform costs in UE4 - Ouch… (at least for me :p). You just educated both me and Erik and probably other people. Yeah basically we both agree using Scaleform has some drawbacks too like I knew it would be tedious (because of the coding aspects that you mentioned) and the fact that you have to have a few different adobe products to pull it off so that also costs a bit. So I guess the real argument lies in the decision to branch off from the UE4 environment and try to bring something external in that could allow for a more custom artistic UI but for an increased price and complexity. It’s a tough decision to be honest and each person is going to think differently due to many factors. Anyways thanks for the post.

sounds like a Web UI plugin is perfect for you.
Take a look at
https://forums.unrealengine.com/showthread.php?6434 (VaQuoleUI)

As UMG evolves I won’t be surprised if it ends up supporting something like SVG for vector graphics based Widget Styles, meaning that you can use any number of external tools like Flash, Illustrator or Inkscape to design your artwork. Given that you can use Textures in your UMG widgets at the moment, the use of vector graphics is really the only reason that you’d get people using Scaleform moving forward, aside from having existing tools/development expertise/licenses, in my opinion.