Unreal Engine Tips: Change Widget Component's Widget Class at Runtime

The Widget Component in Unreal Engine provides the option of rendering widgets that are attached to an actor in the level. Unlike widgets that are directly drawn on the Player HUD, the widget component can render widgets both on screen space as well as the world space, and can thus be used to create spatial/diegetic UI systems (like in Dead Space).

Adding a widget component to your actor follows the same process as adding any other component. But once added, it also requires us to set a widget class so that it knows what widget to render. And this is specified through its Widget Class parameter.

Now while the above solution is ideal for specifying a widget in the editor, it doesn't provide us with any means to change the widget at runtime. Fortunately, the widget component has a BP function specifically for this purpose: the Set Widget node.

However, using this Set Widget node is not as straightforward as setting the Widget Class method mentioned earlier. When we specify the widget class in the component details panel, it creates a widget of said class and assigns it to the widget component automatically. So in order to change the widget at runtime, we have to first create the new widget ourselves and then pass it as input when calling the Set Widget function.

And that's all there is to it. You should now see the new widget replace the one created by default. Here is an example preview of my widget component changing its widget at runtime:

Comments