How to Create a Menu in Unreal Engine 4.6 using Unreal Motion Graphics (UMG) - Part 3

Alright guys, here is our third and final step in implementing your UMG menu in Unreal Engine 4. This step will tie everything together and ensure that any values that you set for your options persist after the values are changed.

Created for UE4 v4.6.1

1. Open up your Level Blueprint by clicking the "Blueprints" button on the top toolbar and selecting the option for the Level Blueprint.

2. Inside the Level Blueprint, use the "My Blueprint" panel on the left to create a variable for the main menu and each of the sub-menus you made in the previous tutorials. Do this by pressing the "+Variable" button and setting the "Variable Type" in your details panel to be what you named the UMG Blueprints you created in the earlier tutorials. Make sure to click the eyeball icon next to each of your variable names to make them public. 

In the screenshot below I have demonstrated these steps by creating a new, unused variable that I deleted after I took this screenshot.

3. Right click on the Blueprint graph and use the context menu to create an "Event Begin Play" node. Drag a wire from this node and use the context menu to place a "Create Widget" node. In the "Widget Type" dropdown box, set your original blueprint menu (the one that contains the "play, high scores, settings, and quit" options that we created in part 1 of this tutorial). If you followed the naming convention we used, it will be "BP_Menu."

4. Drag and drop a Main Menu variable you created in step 2 onto your Blueprint graph and choose to "Set" it. Drag another Main Menu variable onto your graph, but this time choose to "Get" it. Drag the white output wire from the Create Widget node and attach it to the input of the Set Menu node you just added to the graph. Also connect the blue "Return Value" output to the "Main Menu" input of your Set node. 

Drag a wire from the output of the Set Menu node and use the context menu to create an Add to Viewport node. Attach the blue output from the Get BP Menu node you created earlier in this step to the blue "Target" input of the Add to Viewport node.

5. From the Add to Viewport node, drag a wire and use the context menu to make a Create Widget node. Drag your first submenu option onto the graph and "Set" it. In our case, this was the "Sound Options" menu. connect the blue and white wires outputs from the Create Widget node and connect them to your "Set" node. In the drop-down box on the Create Widget node, set the "Class" to be the same as whichever widget you created in this step (so in this example we set the class to be BP_Sound_Options). 

Notice that, unlike in step 4, we are not adding this to the viewport.

6. Repeat the steps in step 5 using the variables remaining for each of your submenus. In our case, we only had to do this one more time for our High Scores menu.

Compile and save your changes and you should now have the framework set up to edit and save values in your menus. Next you can move on to getting your sub-menus working by following our sound options tutorial.