UIMenu is the NativeUI main class, it creates the base menu for you to add items to.

UIMenu mainMenu = new UIMenu("Banner Title", "SUBTITLE", new PointF(0, 0));
MenuPool.Add(mainMenu); // (deprecated after The Gary release v4)

Lua:

local mainMenu = UIMenu.New("Banner Title", "SUBTITLE", 0, 0)
MenuPool:Add(mainMenu) -- (deprecated after The Gary release v4)

UIMenu

The base of each menu.
UIMenu contains the banner, title, subtitle, descriptions, a list of items and windows, the events when anything happens is handled by the menu itself.
It controls everything.. 👀
How do we create a UIMenu?
It is created like this:
C#:

public UIMenu(string title, string subtitle, bool glare = false, bool alternativeTitle = false, float fadingTime = 0.1f)
public UIMenu(string title, string subtitle, PointF offset, bool glare = false, bool alternativeTitle = false, float fadingTime = 0.1f)
public UIMenu(string title, string subtitle, PointF offset, KeyValuePair<string, string> customBanner, bool glare = false, bool alternativeTitle = false, float fadingTime = 0.1f)
public UIMenu(string title, string subtitle, PointF offset, string spriteLibrary, string spriteName, bool glare = false, bool alternativeTitle = false, float fadingTime = 0.1f)

Lua:

UIMenu.New(Title, Subtitle, X, Y, glare, txtDictionary, txtName, alternativeTitle, fadingTime)

What can i do with it?
These are some of the main things you can do with it:
C#:

bool MouseControlsEnabled // true to use mouse 
bool EnableAnimation // enable / disable the scrolling animation (deprecated)
MenuAnimationType AnimationType // what scrolling animation you want it to do? 
bool MouseWheelControlEnabled // true to enable the mouse wheel to scroll the menu
int MaxItemsOnScreen // the number of item to see on the screen before the scrolling kicks in.
ItemFont DescriptionFont // the font that will be used to draw the description text (default ScaleformFonts.CHALET_LONDON_NINETEENSIXTY)
ScrollingType ScrollingType // how the menu will be scrolled (CLASSIC, PAGINATED, ENDLESS)
AddItem(UIMenuItem item) // adds an item to the menu
RemoveItemAt(int index) // removes an item by its index
RemoveItem(UIMenuItem item) // removes an item
AddWindow(UIMenuWindow window) // Adds a windows to the menu
RemoveWindowAt(int index) // removes the window at index
GoUp() // makes the menu go up by 1 item
GoDown() // makes the menu go down by 1 item
GoLeft() // if the item supports it, it makes the item index go left once
GoRight() // if the item supports it, it makes the item index go right once
Select(bool playSound) // the same as pressing return on your keyboard
GoBack() // the same as pressing backspace on your keyboard
bool Visible // this activate the menu and makes it visible on screen, it can return if the menu is visible or not
int CurrentSelection // sets or returns the current selection in menu
bool IsUsingController // returns true if you're using the controller
IndexChangedEvent OnIndexChange(UIMenu sender, int newIndex) // this is called everytime you go up or down in the menu
ItemSelectEvent OnItemSelect(UIMenu sender, UIMenuItem selectedItem, int index) // called when a UIMenuItem is selected
CheckboxChangeEvent OnCheckboxChange(UIMenu sender, UIMenuCheckboxItem checkboxItem, bool Checked) // called when a UIMenuCheckBoxItem is changed true or false
ListChangedEvent OnListChange(UIMenu sender, UIMenuListItem listItem, int newIndex)  // called when a UIMenuListItem is changed left or right
ListSelectedEvent OnListSelect(UIMenu sender, UIMenuListItem listItem, int newIndex) // called when a UIMenuListItem is selected
SliderChangedEvent OnSliderChange(UIMenu sender, UIMenuSliderItem listItem, int newIndex) // called when a UIMenuSliderItem is changed left or right
OnProgressChanged OnProgressChange(UIMenu menu, UIMenuProgressItem item, int newIndex) // called when a UIMenuProgressItem is changed left or right
OnProgressSelected OnProgressSelect(UIMenu menu, UIMenuProgressItem item, int newIndex) // called when a UIMenuProgressItem is selected
StatItemProgressChange OnStatsItemChanged(UIMenu menu, UIMenuStatsItem item, int value) // called when a UIMenuStatsItem is changed left or right
ColorPanelChangedEvent OnColorPanelChange(UIMenuItem menu, UIMenuColorPanel panel, int index) // called when a UIMenuColorPanel is interacted with
PercentagePanelChangedEvent OnPercentagePanelChange(UIMenuItem menu, UIMenuPercentagePanel panel, float value) // called when a UIMenuPercentagePanel is interacted with
GridPanelChangedEvent OnGridPanelChange(UIMenuItem menu, UIMenuGridPanel panel, PointF value) // called when a UIMenuGridPanel is interacted with
MenuStateChangeEvent OnMenuStateChanged(UIMenu oldMenu, UIMenu newMenu, MenuState state) // called when a the menu is opened, closed, changed to a submenu, or gone back to a parent menu

Lua:

:MouseControlsEnabled(bool) -- true to use mouse
:MaxItemsOnScreen(max) -- the number of item to see on the screen before the scrolling kicks in.
:AnimationEnabled(enable) -- enable / disable the scrolling animation
:AnimationType(animType) -- what scrolling animation you want it to do?
:DescriptionFont(font) -- the font that will be used to draw the description text (default ScaleformFonts.CHALET_LONDON_NINETEENSIXTY)
:ScrollingType(type) -- how the menu will be scrolled (CLASSIC, PAGINATED, ENDLESS)
:CurrentSelection(value) -- sets or returns the current selection in menu
:AddWindow(Window) -- Adds a windows to the menu
:RemoveWindowAt(Index) -- removes the window at index
:AddItem(Item) -- adds an item to the menu
:RemoveItemAt(Index) -- removes an item by its index
:RemoveItem(item) -- removes an item
:Visible(bool) -- this activate the menu and makes it visible on screen, it can return if the menu is visible or not
:GoUp() -- makes the menu go up by 1 item
:GoDown() -- makes the menu go down by 1 item
:GoLeft() -- if the item supports it, it makes the item index go left once
:GoRight() -- if the item supports it, it makes the item index go right once
:SelectItem(play) -- the same as pressing return on your keyboard
:GoBack() -- the same as pressing backspace on your keyboard
:AddInstructionButton(button) -- adds an instructional button to the current menu
:RemoveInstructionButton(button) -- removes an instructional button to the current menu
OnIndexChange = function(menu, newindex) -- this is called everytime you go up or down in the menu
OnListChange = function(menu, list, newindex) -- called when a UIMenuListItem is changed left or right
OnSliderChange = function(menu, slider, newindex) -- called when a UIMenuSliderItem is changed left or right
OnProgressChange = function(menu, progress, newindex) -- called when a UIMenuProgressItem is changed left or right
OnCheckboxChange = function(menu, item, checked) -- called when a UIMenuCheckBoxItem is changed true or false
OnListSelect = function(menu, list, index) -- called when a UIMenuListItem is selected
OnSliderSelect = function(menu, slider, index) -- called when a UIMenuSliderItem is selected
OnProgressSelect = function(menu, progress, index) -- called when a UIMenuProgressItem is selected
OnItemSelect = function(menu, item, index) -- called when a UIMenuItem is selected
OnMenuChanged = function(oldmenu, newmenu, change) -- called when a the menu is opened, closed, changed to a submenu, or gone back to a parent menu
OnColorPanelChanged = function(oldmenu, newmenu, change) -- called when a UIMenuColorPanel is interacted with
OnPercentagePanelChanged = function(oldmenu, newmenu, change) -- called when a UIMenuPercentagePanel is interacted with
OnGridPanelChanged = function(oldmenu, newmenu, change) -- called when a UIMenuGridPanel is interacted with

Note that this are some of the UIMenu function working atm and they can be changed / added / removed in any moment due to development needs!

Description

The menu will show a description for each item that has one, the description is bounded to the selected item and will change when you select a different item.
It supports emojis, blips, and input icons.

Menu Items

Each menu you'll make will have these items, they're one of the main part of the menu building, the user will interact with the items and the items will produce events in which you can respond based on user input.

If you're coding in LUA, when creating items, you can avoid setting the colors, they will be defaulted to the default menu color.
Also in the :function(something) functions, if you don't send anything in you'll get the value in return.
Example:
Lua:

item:RightLabel("hi i'm the right label") -- this will set the right label
local rightLabel = item:RightLabel() -- this will return the item's right label.

UIMenuItem

The Basic item, this is the one from which all other items come from, it can have a right label that can change based on needs.
Note:
To know what badges are available, check Elements/Badge.lua!
To know the colors available check https://docs.fivem.net/docs/game-references/hud-colors/

Called via: C#:

public UIMenuItem(string text);
public UIMenuItem(string text, string description);
public UIMenuItem(string text, uint descriptionHash);
public UIMenuItem(string text, string description, HudColor mainColor, HudColor highlightColor);
public UIMenuItem(string text, uint descriptionHash, HudColor mainColor, HudColor highlightColor);
public UIMenuItem(string text, string description, HudColor color, HudColor highlightColor, HudColor textColor, HudColor highlightedTextColor);
public UIMenuItem(string text, uint descriptionHash, HudColor color, HudColor highlightColor, HudColor textColor, HudColor highlightedTextColor);

Lua:

UIMenuItem.New(text, description, color, highlightColor, textColor, highlightedTextColor)

This menu is the one from which all other items inherit, this means that every other menu item has the same functions and features of this item except for some disabled ones for design reason.

C#:

HudColor MainColor { get; set; }
HudColor HighlightColor { get; set; }
HudColor TextColor { get; set; }
HudColor HighlightedTextColor { get; set; }
bool BlinkDescription { get; set; }
bool Selected { get; set; }
string Description { get; set; }
uint DescriptionHash { get; set; }
bool Enabled { get; set; }
string Label { get; set; }
SetLeftBadge(BadgeIcon badge)
BadgeIcon LeftBadge { get; }
SetRightBadge(BadgeIcon badge)
BadgeIcon RightBadge { get; }
SetRightLabel(string text)
string RightLabel { get; }
AddPanel(UIMenuPanel panel)
RemovePanelAt(int Index)
AddSidePanel(UIMenuSidePanel panel)
RemoveSidePanel()
UIMenu Parent { get; }
dynamic ItemData { get; set; }
ItemActivatedEvent Activated(UIMenu menu, UIMenuItem item)

Lua:

.ParentMenu
.RightBadge
.LeftBadge
:Selected(bool)
:Enabled(bool)
:Description(string)
:MainColor(color)
:TextColor(color)
:HighlightColor(color)
:HighlightedTextColor(color)
:Label(Text)
:RightLabel(Text)
:RightBadge(Badge)
:LeftBadge(Badge)
:AddPanel(Panel)
:RemovePanelAt(Index)
:AddSidePanel(sidePanel)
:BlinkDescription(bool)
Activated = function(menu)

UIMenuListItem

The second item you'll learn is the List item. In this you specify a list of items and the menu will scroll the items going left/right.
This item has 2 events, OnListChang called everytime the user goes left/right and OnListSelect called when the user press return on this item.
The item inherits all the UIMenuItem functions and adds some of his. Called with:

C#:

UIMenuListItem(string text, List<dynamic> items, int index)
UIMenuListItem(string text, List<dynamic> items, int index, string description)
UIMenuListItem(string text, List<dynamic> items, int index, string description, HudColor mainColor, HudColor higlightColor)
UIMenuListItem(string text, List<dynamic> items, int index, string description, HudColor mainColor, HudColor higlightColor, HudColor textColor, HudColor highlightTextColor)

Lua:

UIMenuListItem.New(Text, Items, Index, Description, mainColor, highlightColor, textColor, highlightedTextColor)

Let's see what functions this item has besides the original ones and what functions are not available:

C#:

int Index { get; set; }
List<object> Items { get; }
ChangeList(List<dynamic> list, int index)
SetRightBadge(BadgeIcon badge) // NOT AVAILABLE WILL THROW EXCEPTION
SetRightLabel(string text) // NOT AVAILABLE WILL THROW EXCEPTION
OnListChange(UIMenuListItem item, int index)
OnListSelect(UIMenuListItem item, int index)

Lua:

.Items
:Index(Index)
:RightBadge() -- NOT AVAILABLE WILL PRINT AN ERROR
:RightLabel() -- NOT AVAILABLE WILL PRINT AN ERROR
:ChangeList(list)
OnListChang = function(menu, item, newindex)
OnListSelect = function(menu, item, newindex)

UIMenuDynamicListItem

This is a dynamic version of the ListItem where you don't give a predefined list inside, but the right item selected is given on runtime (Very handy when positioning object for example or for very big lists where you can handle the right index by code and return the selected item here).

Called with:
C#:

UIMenuDynamicListItem(string text, string startingItem, DynamicListItemChangeCallback changeCallback)
UIMenuDynamicListItem(string text, string description, string startingItem, DynamicListItemChangeCallback changeCallback)

Lua:

UIMenuDynamicListItem.New(Text, Description, StartingString, callback, color, highlightColor, textColor, highlightedTextColor)

Starting item is the right item where you start.

Its functions are:
C#:

delegate Task<string> DynamicListItemChangeCallback Callback(UIMenuDynamicListItem sender, ChangeDirection direction);
string CurrentListItem { get; set; }

Lua:

:CurrentListItem(item)

How do i use it? Pretty simple:
C#:

float dynamicvalue = 0f;
dynamicItem = new UIMenuDynamicListItem("Dynamic List Item", "Try pressing ~INPUT_FRONTEND_LEFT~ or ~INPUT_FRONTEND_RIGHT~", dynamicvalue.ToString("F3"), async (sender, direction) =>
{
	if (direction == UIMenuDynamicListItem.ChangeDirection.Left) dynamicvalue -= 0.01f;
	else dynamicvalue += 0.01f;
	return dynamicvalue.ToString("F3");
});

Lua:

local dynamicValue = 0
local dynamicListItem = UIMenuDynamicListItem.New("Dynamic List Item", "Try pressing ~INPUT_FRONTEND_LEFT~ or ~INPUT_FRONTEND_RIGHT~", tostring(dynamicValue), function(item, direction)
	if(direction == "left") then
		dynamicValue = dynamicValue -1
	elseif(direction == "right") then
		dynamicValue = dynamicValue +1
	end
	return tostring(dynamicValue)
end)

Explanation: being this item very dynamic the callback you set when declaring it is the basic function called everytime you press left or right.
After pressing left or right, something happens and a new value is returned to the item that will set it as its right label, pretty handy when you don't know what will come out. Let the game do it for you!!

UIMenuCheckboxItem

This item is basically a switch, returns true / false

Called via:

C#:

UIMenuCheckboxItem(string text, bool check)
UIMenuCheckboxItem(string text, bool check, string description)
UIMenuCheckboxItem(string text, UIMenuCheckboxStyle style, bool check, string description)
UIMenuCheckboxItem(string text, UIMenuCheckboxStyle style, bool check, string description, HudColor mainColor, HudColor highlightColor)

Lua:

UIMenuCheckboxItem.New(Text, Check, checkStyle, Description, color, highlightColor, textColor, highlightedTextColor)

This item works simply by pressing return onto it or selecting it with your mouse, it will change its state.
The only event this item has is CheckboxEvent called when you change its state.

Functions available:
C#:

UIMenuCheckboxStyle Style { get; }
bool Checked { get; set; }
CheckboxEvent(UIMenuCheckboxItem item, bool newState)

Lua:

.CheckBoxStyle
:Checked(bool)
.OnCheckboxChanged = function(menu, item, checked)

UIMenuSliderItem

A slider, a section of a progress item that slides in a predefined space.

It comes with Mom and Dad icons too, simply set Heritage value to true!
This item works with int values, if you want to work with floating points you can convert its value.
You can specify the slider color.

Called via:
C#:

UIMenuSliderItem(string text)
UIMenuSliderItem(string text, string description)
UIMenuSliderItem(string text, string description, bool heritage)
UIMenuSliderItem(string text, string description, int max, int mult, int startVal, bool heritage)HudColor.HUD_COLOUR_FREEMODE, heritage)
UIMenuSliderItem(string text, string description, int max, int mult, int startVal, HudColor sliderColor, bool heritage = false)

Lua:

function UIMenuSliderItem.New(Text, Max, Multiplier, Index, Heritage, Description, sliderColor, color, highlightColor, textColor, highlightedTextColor)

Its functions are:
C#:

HudColor SliderColor { get; set; }
ItemSliderEvent OnSliderChanged(UIMenuSliderItem item, int newIndex)
int Value { get; set; }

Lua:

:SliderColor(color)
:Index(Index)
.OnSliderChanged = function(menu, item, newindex)
.OnSliderSelected = function(menu, item, newindex)

UIMenuProgressItem

This item is the same identical tween of UIMenuSliderItem with the only difference that the colored bar doesn't move but increases or decreases in side. The only difference with the slider is that the event called when it gets changed is OnProgressChanged in C# and in Lua

UIMenuStatsItem

This item behaves like the UIMenuProgressItem so it's pretty basic how it works.

UIMenuSeparatorItem

The separator. An item many people asked me, you can decide if it's ignored or selectable. It has no functions and no events as it's only a separator.

Called via: C#:

UIMenuSeparatorItem(string title, bool jumpable)

Lua:

UIMenuSeparatorItem.New(Text, jumpable , mainColor, highlightColor, textColor, highlightedTextColor)

Panels and Side Panels

Panels in ScaleformUI are available in 2 different types, classic panels, and side panels.
Each panel is bound to an item, this means that if a panel is added to an item, it will be visible only if that item is selected.
All panels are directly accessible only by the mouse cursor, but can be interacted with the controller or code via their methods / values.

Panels

UIMenuColorPanel

The first of the panels we are gonna see now is the Color panel.
It comes in 3 different color templates:

Makeup colors (64 colors for make up palette)
Hair colors (64 colors for hair palette)
Custom colors (customizable number of colors decided by the developer) It's called via: C#:

UIMenuColorPanel(string title, ColorPanelType ColorType, int startIndex = 0) // for the predefined palettes
UIMenuColorPanel(string title, List<HudColor> colors, int startIndex = 0) // for the customizable colors

Lua:

UIMenuColorPanel.New(title, colorType, startIndex, colors) // colors is nil if using predefined palettes or a table of colors

Currently ScaleformUI supports only HUD colors, this means you can only set a custom palette by using a List in C# or a table of strings in Lua ad example: {"HUD_COLOUR_GREEN", "HUD_COLOUR_RED", "HUD_COLOUR_FREEMODE", "HUD_COLOUR_PURPLE", "HUD_COLOUR_TREVOR"}
The color panel has only a couple more of features: C#:

int CurrentSelection{ get; set; }
ColorPanelChangedEvent OnColorPanelChange(UIMenuItem parentItem, UIMenuColorPanel panel, int newValue)

Lua:

:CurrentSelection(new_value)
OnColorPanelChanged = function(item, panel, newindex)

UIMenuPercentagePanel

This panel is simply a progressive panel.
Called via: C#:

UIMenuPercentagePanel(string title, string MinText = "0%", string MaxText = "100%", float initialValue = 0)

Lua:

UIMenuPercentagePanel.New(title, minText, maxText, initialValue)

Its functions are: C#:

float Percentage { get; set; }
PercentagePanelChangedEvent OnPercentagePanelChange(UIMenuItem item, UIMenuPercentagePanel panel, float value)

Lua:

:Percentage(value)
OnPercentagePanelChange = function(item, panel, value)

UIMenuGridPanel

This scaleform comes 2 variants: full / horizontal.
It's value is a Vector2 in Lua and a PointF in C#, both X and Y go from 0 to 1 this means that a value of 0.5 is the center of the grid.

Called via:
C#:

UIMenuGridPanel(string TopText, string LeftText, string RightText, string BottomText, PointF circlePosition) // full grid
UIMenuGridPanel(string LeftText, string RightText, PointF circlePosition) // half grid

Lua:

UIMenuGridPanel.New(topText, leftText, rightText, bottomText, circlePosition, gridType) -- set gridType to 0 for the full grid or 1 for the horizontal grid

Its functions are:
C#:

PointF CirclePosition { get; set; }
GridPanelChangedEvent OnGridPanelChange(UIMenuItem item, UIMenuGridPanel panel, PointF newPosition)

Lua:

:CirclePosition(position)
OnGridPanelChanged = function(item, panel, newPosition)

UIMenuStatisticsPanel

This panel is not interactable by user input, it will only show given infos.
Called via: C#:

UIMenuStatisticsPanel()

Lua:

UIMenuStatisticsPanel.New(items)

The panel is essentially a list of statistics, you can add them via: C#:

panel.AddStatistics(string Name, float val)

Lua:

:AddStatistic(name, value)

The available functions for this panel are:
C#:

AddStatistics(string Name, float val)
float GetPercentage(int ItemId)
SetPercentage(int ItemId, float number)

Lua:

:AddStatistic(name, value)
:GetPercentage(id) -- returns a statistic value
:UpdateStatistic(id, value) -- updates an existing statistic value

Side Panels

Currently only 2 side panels are available.

UIVehicleColourPickerPanel

Since the classic color panel is not enough to show all the vehicle colors available, i decided to make a new side panel only for them.

you call it via:
C#

public UIVehicleColourPickerPanel(PanelSide side, string title)
public UIVehicleColourPickerPanel(PanelSide side, string title, HudColor BgColor)

Lua

UIVehicleColorPickerPanel.New(side, title, color)

Its functions are:
C#

string Title { get; set; }
VehicleColorPickerSelectEvent OnVehicleColorPickerSelect(UIMenuItem item, UIVehicleColourPickerPanel panel, int colorIndex)

Lua

:UpdatePanelTitle(title)
PickerSelect = function(item, panel, colorIndex)

UIMissionDetailsPanel

Initialized via:

public UIMissionDetailsPanel(PanelSide side, string title, bool inside, string txd = "", string txn = "")
public UIMissionDetailsPanel(PanelSide side, string title, HudColor color, string txd = "", string txn = "")

Lua:

UIMissionDetailsPanel.New(side, title, color, inside, txd, txn)

This panel is a bit more complex as it needs 1 more item to work, for each item in the side panel we must initialize a new UIMenuFreemodeDetailsItem:
C#:

UIFreemodeDetailsItem(string textLeft, string textRight, bool separator)
UIFreemodeDetailsItem(string textLeft, string textRight, BadgeIcon icon, HudColor iconColor = HudColor.HUD_COLOUR_FREEMODE, bool tick = false)

Lua:

UIMenuFreemodeDetailsItem.New(textLeft, textRight, seperator, icon, iconColor, tick) -- if icon and iconColor are specified, then separator will be ignored, also icon is a Badge.. the same used for normal UIMenuItems

The panel's functions are:
C#:

string Title { get; set; }
UpdatePanelPicture(string txd, string txn)
AddItem(UIFreemodeDetailsItem item)
RemoveItem(int idx)

Lua:

:UpdatePanelTitle(title)
:UpdatePanelPicture(txd, txn)
:AddItem(newitem)
:RemoveItemAt(index)

UIMenu - manups4e/ScaleformUI GitHub Wiki

UIMenu

Description

Menu Items

UIMenuItem

UIMenuListItem

UIMenuDynamicListItem

UIMenuCheckboxItem

UIMenuSliderItem

UIMenuProgressItem

UIMenuStatsItem

UIMenuSeparatorItem

Panels and Side Panels

Panels

UIMenuColorPanel

UIMenuPercentagePanel

UIMenuGridPanel

UIMenuStatisticsPanel

Side Panels

UIVehicleColourPickerPanel

UIMissionDetailsPanel

Title :)

⚠️ GitHub.com Fallback ⚠️

UIMenu - manups4e/ScaleformUI GitHub Wiki

UIMenu

Description

Menu Items

UIMenuItem

UIMenuListItem

UIMenuDynamicListItem

UIMenuCheckboxItem

UIMenuSliderItem

UIMenuProgressItem

UIMenuStatsItem

UIMenuSeparatorItem

Panels and Side Panels

Panels

UIMenuColorPanel

UIMenuPercentagePanel

UIMenuGridPanel

UIMenuStatisticsPanel

Side Panels

UIVehicleColourPickerPanel

UIMissionDetailsPanel

Title :)

⚠️ **GitHub.com Fallback** ⚠️

⚠️ GitHub.com Fallback ⚠️