Automatic Radial Menus
User Guide (V1.0)
Automatic Radial Menus is a UE4 plugin which can be used to generate a radial menu of any size. The plugin manages user interaction and events for use with either a mouse or gamepad. This plugin can be implemented with 100% blueprint code, however, it also can be used in C++ if desired.
Links and Support
- Purchase on FAB: Fab Listing
- Itch.io: https://samcarey.itch.io/dynamic-radial-menu-system-ue4-asset
- Official Website: www.samcarey.tech
- Support Email: contact@samcarey.tech
- Join the Community on Discord: discord.gg/BzmVednF2n
- Report Issues: Bug Report Form
Key Features
- Generate radial menu segments of any size.
- Controls user input for mice/keyboards and gamepads.
- Vast customisation options.
- Automatically apply text and images to segments.
- Bind hover, unhover and click events to any action.
- Blueprint and C++ compatible.
Creating a Radial Menu
To create a radial menu you must simply drag ‘Widget_RadialMenu’ blueprint onto your user widget. The radial menu can be anchored and have its size and position controlled by other panel widgets without issue. The radial menu should always be a 1:1 aspect ratio to ensure segments align correctly. From here there are several settings which can be used to define the look and content of the menu.
Menu Preview
The ‘Generate Menu’ button can be clicked to show a preview of the menu. This preview will disappear when compiling the user widget however, it will still be visible within the game.
Segments Array
The segment array controls all the segments in the menu. Here you can define an image and text for each segment. Note there is no way to set the size of a segment as this action is performed automatically based on the number of segments in the list.
Important Note - You do not need to add segment blueprints manually. The radial object will automatically generate everything needed from the segment array.
Other Settings
Other properties can be set to adjust the animations when selecting and widget and the styling of the segment itself. To have no select animation simply set the ‘Move Distance’ to 0. Under the ‘Other Radial Menu Settings’ section, the image and style of the center arrow can be defined. If creating a custom arrow, ensure that the point is facing to the right of the image.
Segment Style | Other Style (Arrow and arrow base) |
---|---|
Creating a Segment Style
To create a segment style you must first create a material instance based on ‘RadialSegment_M’. From here all styling settings can be defined. You should create two materials, one for the selected and one for the unselected state. To access the material ensure that you have selected ‘Show editor content’ in the content browser.
The ‘PreviewSegments’ parameter is only used to preview the material at different sizes. The size will be dynamically set at runtime to match the number of segments in the list.
After you have created your materials you add these to the radial menu instance and they will be automatically used.
Interaction and Gamepad support
To interact with the radial menu certain functions will need to be called. These could be called from the PlayerController or PlayerCharacter The following blueprint code can be found in the ‘Examples’ folder.
Gamepad Interaction
You must pass in the X and Y values of a thumbstick when the gamepad is being used. An example of this can be seen below. You may also want to hide the mouse cursor here when using a controller.
Click Events
Click events must be triggered in a similar fashion by calling 'interact' on a radial menu object.
Binding Events
There are three events which can be used: OnHover
, OnUnHover
and OnClick
. The two following functions can be used to get segments from a radial menu allowing events to be connected.
- Blueprint
- C++
TArray<URadialMenuSegment *> GetAllSegments();
URadialMenuSegment *GetRadialSegmentAtIndex(int32 Index);
The following example gets all segments in a menu and binds them to an event which prints their text when clicked. This could be used to hook up any game event e.g. equip a weapon, drop an item, select a building resource etc.
Binding Example
- Blueprint
- C++
void UExampleCBindings::NativeOnInitialized()
{
Super::NativeOnInitialized();
TArray<URadialMenuSegment *> Segments = RadialMenu->GetAllSegments();
for (URadialMenuSegment* i : Segments)
{
FScriptDelegate Delegate;
Delegate.BindUFunction(this, "OnClick_Event");
i->OnSegmentClick.AddUnique(Delegate);
}
}
void UExampleCBindings::OnClick_Event(URadialMenuSegment * Segment, FRadialSegmentData SegmentData)
{
GEngine->AddOnScreenDebugMessage(-1, 15.0f, FColor::Yellow, SegmentData.SegmentText.ToString());
}
Extra details and code samples: https://github.com/SamCarey99/Automatic-Radial-Menus-Code-Samples