Input Icons

Overview

WBP_InputIcon is our solution to handling on-screen widgets to represent particular inputs. e.g. if you want to give a prompt for the "jump" button, it will show the key mapped to the jump button (e.g. spacebar)

Using this widget over hard-coding the icon gives us benefits such as allowing it to update automatically if the mapping for a given input changes.

We have a widget with the "Jump" input action. The widget therefore shows the spacebar
In the Project Settings, we have defined that the "Jump" input action maps to space bar for Keyboard

How this works

This widget determines the key from the input action provided, and looks up the corresponding icon from the M2_InputIconMap

Which map is used (and so the styling of icons per key) is determined by your skin settings. By default DA_InputIconMap is used.

NOTE: If you need any icons which aren't defined in DA_InputIconMap you will need to supply your own map. See Using Skins with Input Icons for details on how to do this.

How to use the input icon widget

  1. Add the widget.

  2. Provide an action for the widget. This can be done in a number of ways:

    1. Provide an InputActionName in the Designer view. This is the value of an "input action" in your project settings (Note this may not be easily configurable in WorldBuilder projects)

      How the configuration looks in the designer view - Uses Enhanced Input Action is false, and the Input Action Name is provided
      In the above example, this is the input action that the icon is representing
    2. Provide an "Enhanced input" action and mapping context for your icon in the designer view.

      Uses Enhanced Input Action is set to true.
      The above Input Mapping Context, showing the Input Action (IA_QuickbarPrimaryAction mapped to left click
    3. Update/set the the icon through BP/Code: If the icon you're wanting to display depends on data passed through, this can be used. It works for both the standard input ActionMappings, or EnhancedInput.

Using Skins with Input Icons

Support for skinning is ending soon. Please see https://docs.msquared.io/tutorials-and-features/ui/how-to-use-skins for details.

For more details on how skins work, and what they are, see How to use skins.

  • Create a new M2_InputIconMap, and provide the required icons for the required keys. (I'd recommend copying the existing DA_InputIconMap, so that the map is largely filled in already)

    Adding a DA_InputIconMap_MyProject, and filling it out.
  • In your skin's SkinSettings, add a M2_InputIconSkinSetting entry.

  • In this, provide your newly created icon map asset

Upcoming Work

  • We still need to fill our our icon map with all the relevant icons

  • The input icon widget approach will later be extended to support different control schemes, i.e. swapping out the icons when switching to using gamepad.

  • We will later also support "custom icon names", to provide icons for things that don't have a direct action mapping, e.g. "WASD and mouse movement, for moving and looking around

Last updated