UMG vs Slate vs Canvas

Going a little necro on this post :roll_eyes:

@Everynone I think the Canvas @ZackReganSounds is talking about is UCanvas (not related to UMG or Slate), while you are referring to UCanvasPanel (the panel you see in the UMG editor). There’s also SPanel (the base class of container widgets in Slate) and SCanvas (an SPanel sub-class that implements arbitrary layout for each of its collection items).

@Mootjuh, if you’re just learning Unreal or don’t know C++, I agree UMG is the best choice. However, I don’t think there is a best choice for all situations. Rather, it depends on what you’re trying to do and how you are integrating the UI with the rest of the game.

UMG (Blueprints or C++) and Slate (C++ only) are both widget toolkits. They give you objects that don’t just draw, but provide UI functionality like text edit boxes, grid layout, canvas layout, spinners/throbbers, etc. Both frameworks have an opinionated way to arrange and draw items, which creates a consistent (relatively easy) way to develop a new UMG/Slate widget and have it work along side your other UMG/Slate widgets. Many Slate items are wrapped by UWidget (the C++ class for UMG widgets). It’s also easy to wrap your own Slate C++ widgets in a UWidget to expose it to UMG. UMG is built directly on top of Slate. In fact, one of the primary things a UMG widget has to do is override the UWidget::RebuildWidget function to construct the underlying Slate widget.

UCanvas, on the other hand, is like a painting program. You can do things like draw text and images. UCanvas is used by the AHUD actor, but it’s also used other places in the engine to provide debug graph overlays. It’s easy to understand, but as your UI code grows you will have to coordinate all your drawing code, and, if you don’t give it enough thought, you’ll probably end up coming up with something like a poor man’s version of Slate/UMG.

My recommendations are:

  • If your game is primarily blueprints, use UMG.
  • If your game has a lot of C++, use UMG and write custom Slate components exposed to UMG as needed.
  • Create a UMG widget called HUD that you use as the top level container for all your widgets so you can use the UMG editor to layout all your widgets.
  • For each widget you build:
    • Implement a widget in UMG if everything the widget needs is already exposed to Blueprints and is simple (in terms of blueprint graph node count).
    • Implement a widget in Slate if it needs to call a into a lot of C++ code that isn’t exposed to blueprints, or is complex (in terms of blueprint graph node count). The complexity thing is a personal preference of mine as I find it easier to manage many lines of C++ code than managing many Blueprint graph nodes.

Also:

  • If you want to layout your UI completely in C++, use Slate. In this situation, you’re probably not going to use UMG at all.
  • If you want to layout your UI visually in an editor, use UMG. In this situation, you can still write your own custom Slate widgets in C++, but you’ll also need to wrap them in UWidgets.
  • If you don’t know UMG or Slate and your UI is very simple and you know your UI isn’t going to change much, maybe use UCanvas. This recommendation is only to save you time from unnecessarily having to learn UMG or Slate.
52 Likes