Open/Close UI menu with key press?

What I am trying to do is have the Tab key open and close the player’s inventory UI in an FPS game. I was hoping to accomplish this simple task through the blueprints but it has turned out to be a wild goose chase. I have searched the forums, the answerhub, I have watched youtube tutorials, and I’ve been talking to people on a few discords for unreal game developers, and nobody seems to have a real solution for this. Even the tutorial for making a pause menu in Unreal’s is pretty useless. Setting the input mode to ‘Game and UI’ is not a real solution. I am dumbfounded. It is crazy to me that it is this much of a hassle to set up some basic and essential UI functionality that is present in most games. I know its possible because I have played games which run on Unreal that do this. However, I assume they wrote their own code to get this functionality. Is the only way to toggle a UI menu with a keypress to write the code yourself?

1 Like

At this point you may want to consider finding more step-by-step tutorials and following through them to get a better understanding of the engine and how to use it.
Game development is hard. It’s a lot easier to imagine a project than create it, and even with fancy tools like Unreal Engine, you can still spend months or years learning how to make something basic. After five years, you still learn new things every week.

As for your current task, I break it into two parts:
1 Detect when the player has pressed Tab
2 Show/Hide a UMG Widget

PART ONE -----
You can detect when the player has pressed an input in several places, in this case I think your best bet is to do it in the character. Here is some info on other places you could check for the input:
https://docs.unrealengine.com/4.27/en-US/InteractiveExperiences/Input/#inputprocessingprocedure
First off, in your project settings under “Input,” set up an action for “ToggleInventory” and bind it to the Tab key on the keyboard.
After that, go to your character and make a node on the event graph for “Input Action Toggle Inventory”
Add some print string nodes to Pressed and Release, and then test it in your game to see if it works.
If you’re stuck, look up examples of setting up player inputs.

PART TWO ----
First, make a UMG Widget for your inventory. Don’t worry about making anything work, you can just add some images so that we can quickly get around to testing whether it shows up properly.
UMG is a whole system with its own ins and outs, I highly recommend Matthew Wadstein’s tutorials as the fastest way to get up and running with that.

The way I’m going to mention is the simplest way I can think of, probably not the way AAA games would work but it should work for you.
In your character’s BeginPlay function, add the following Nodes:

  • Create Widget (set the widget to the one you created for your inventory)
    Drag out from the blue node coming out of it, and click “Promote to Variable.”
    Name the variable InventoryWidget, which should create the second node:
  • Set InventoryWidget (connected by two wires to the first node)
    Now, the widget exists… but we can’t see it. Drag out from the blue node again, and add two more nodes coming from it:
  • Add to Viewport
  • Set Visibility (set the checkbox to Visible)

TEST-- Test early, test often! At this point when you start the game, the widget should show up on your screen.

But now you want it to toggle.

PART 3 out of 2 ? -------

First off, change the “Set Visibility” node you put on BeginPlay to “Hidden”
Now, the widget should not show up visibly when you start the game, but it does exist in memory.

Get rid of the print statements after the Input Action ToggleInventory and in the place of one of them, make these nodes

  • Get InventoryWidget, connected to:
  • Is Visible, connect the output of that to a
  • Branch
  • True branch output: Connect a InventoryWidget node to a “Set Visibility: Hidden”
  • False branch output: Connect a InventoryWidget node to a “Set Visibility: Visible”

That’s a lot of step-by-step. This video tutorial pretty much covers this half of the task, if you get stuck try following this: Displaying UI Widgets On Screen - #5 Unreal Engine 4 User Interface Development Tutorial Series - YouTube

Check my post here:

Start from the bit that goes:

Not stupid at all, actually. It’s just an input processing thing.

Thank you for the answer. This method is working for one widget, but not another. There are two issues.

The first is that when the pause menu widget is brought up, the game inputs do not clear. So, for example, if the player is walking forwards and presses the pause menu key, the character continues to walk forwards while the pause menu is up. This does not happen when bringing up the inventory widget.

Here is the blueprint for the player character, where the widgets are brought up:

Secondly, the On Key Down override doesn’t seem to be working for the pause menu widget. I added print strings to each of the overrides to try and debug.

This is my blueprint for the inventory menu On Key Down:

And this is my blueprint for the pause menu On Key Down:

When the inventory widget is open, and the Tab key is pressed, the menu closes and the ‘Hello’ string is printed. But when P is pressed on the pause menu, nothing happens, and no ‘Hello’ string is printed. I’d like to note that I am not actually pausing the game yet, just trying to get the UI to open/close with key presses.

It’s and old / known issue - call this before bringing up the menu and changing Input Mode - may help. Do tell!

image

the On Key Down override doesn’t seem to be working for the pause menu widget.

You need to ensure that:

  • the widget is keyboard focusable
  • give the widget focus

This fixed both issues:

So I guess the keyboard was still focused on the game controller thus not clearing the input and not allowing the widget to detect key presses. Not sure why one widget needs this command and not the other, but at least it works for now.

1 Like