[Release] MenuV - Standalone NUI menu for FiveM (v1.4), docs added!

MenuV | Standalone Menu for FiveM | NUI Menu Library (v1.4)

ThymonA License GitHub all releases


MenuV is a library written for FiveM and only uses NUI functionalities. This library allows you to create menus in FiveM. This project is open-source and you must respect the license and the hard work.

Features

  • Support for simple buttons, sliders, checkboxes, lists and confirms
  • Support for emojis on items
  • Support for custom colors (RGB)
  • Support for all screen resolutions.
  • Support for all screen positions.
  • Support for native sound effects.
  • Support for two themes: default and native
  • Item descriptions
  • Rebindable keys
  • Event-based callbacks
  • Uses 2 msec while menu open and idle.
  • Banner YTD support
  • FX Version: cerulean
  • Colour support like: ^1 or ~r~ etc.

How to use?

  1. Add start menuv to your server.cfg before the resources that’s uses menuv

  2. To use MenuV you must add @menuv/menuv.lua in your fxmanifest.lua file.

    client_scripts {
       '@menuv/menuv.lua',
       'example.lua'
    }
    

Create a menu

Create a menu by calling the MenuV:CreateMenu function.

MenuV:CreateMenu(title: string, subtitle: string, position: string, red: number, green: number, blue: number, size: string, texture: string, dictionary: string)

Example:

local menu = MenuV:CreateMenu(false, 'Welcome to MenuV', 'topleft', 255, 0, 0, 'size-125', 'example', 'menuv', 'default')

Create menu items

Create a item by calling AddButton, AddConfirm, AddRange, AddCheckbox or AddSlider in the created menu

/** CREATE A BUTTON */
menu:AddButton({ icon: string, label: string, description: string, value: any, disabled: boolean });

/** CREATE A CONFIRM */
menu:AddConfirm({ icon: string, label: string, description: string, value: boolean, disabled: boolean });

/** CREATE A RANGE */
menu:AddRange({ icon: string, label: string, description: string, value: number, min: number, max: number, disabled: boolean });

/** CREATE A CHECKBOX */
menu:AddCheckbox({ icon: string, label: string, description: string, value: boolean, disabled: boolean });

/** CREATE A SLIDER */
menu:AddSlider({ icon: string, label: string, description: string, value: number, values: [] { label: string, value: any, description: string }, disabled: boolean });

To see example in practice, see example.lua

Documentation

Read MenuV documentation

License

Project is written by ThymonA and published under GNU General Public License v3.0 Read License

Download

Latest Version

Versions

v1.4
v1.3
v1.2
v1.1
v1.0

Links

Documentation
GitHub Releases
GitHub Project
GitHub README.md
Previous Screenshot

Screenshot

Default Theme
MenuV Default

Native Theme
MenuV Native

If you experience issues, you can report them as an issue on GitHub | Report Issue.

Written by:
ThymonA // Tigo

GitHub: ThymonA
FiveM Forum: TigoDEV

34 Likes

Hardcore is your middle name. OOP in lua :slight_smile:

2 Likes

It also makes extending and maintaining a script easier. Thank you for the compliment :blue_heart:.

1 Like

Aye! This is a nice, new, sleek system! :slight_smile:

3 Likes

This is really dope.

1 Like

Such amazing timing to release this. Is it possible to use a custom ytd/png banner as the header for the menu?

Not yet, I’m going to work on it.

Amazing as you! Thanks for share!

In the next release banner support will be available.

2 Likes

Great interface, is there any way to create sub-menus?

There are no “submenus”, however you can use any created menu in another menu.

local menu = MenuV:CreateMenu('MenuV', 'Welcome to MenuV', 'topleft', 255, 0, 0)
local submenu = MenuV:CreateMenu('Submenu?', 'Welcome to MenuV', 'topleft', 255, 0, 0)

menu:AddButton({ icon = '😃', label = 'Open Submenu', value = submenu, description = 'Open menu called submenu' })

By using any menu as value inside a Button, MenuV automatically opened that menu when user pressed “ENTER”.

This is a sleek looking Menu, Thank you!

1 Like

Very nice.

1 Like

Hello ~ how to show the menu ?

You can do

local menu = MenuV:CreateMenu('MenuV', 'Welcome to MenuV', 'topleft', 255, 0, 0)

menu:Open()

--- or

MenuV:OpenMenu(menu)
1 Like

thank you , Very good project, hope to experience the background board function earlier :slight_smile:

Hi, I used this code, it correctly print test and test2, but the menu is not displayed


local assert = assert
local MenuV = assert(MenuV)


local menu = MenuV:CreateMenu('MenuV', 'Welcome to MenuV', 'topleft', 255, 0, 0)
local menu2 = MenuV:CreateMenu('Demo 2', 'Open this demo menu in MenuV', 'topleft', 255, 0, 0)

local menu_button = menu:AddButton({ icon = '😃', label = 'Open Demo 2 Menu', value = menu2, description = 'YEA :D from first menu' })
local menu2_button = menu2:AddButton({ icon = '😃', label = 'Open First Menu', value = menu, description = 'YEA :D from second menu' })
local confirm = menu:AddConfirm({ icon = '🔥', label = 'Confirm', value = 'no' })
local range = menu:AddRange({ icon = '⚽', label = 'Range Item', min = 0, max = 10, value = 0, saveOnUpdate = true })
local checkbox = menu:AddCheckbox({ icon = '💡', label = 'Checkbox Item', value = 'n' })
local slider = menu:AddSlider({ icon = '❤️', label = 'Slider', value = 'demo', values = {
    { label = 'Demo Item', value = 'demo', description = 'Demo Item 1' },
    { label = 'Demo Item 2', value = 'demo2', description = 'Demo Item 2' },
    { label = 'Demo Item 3', value = 'demo3', description = 'Demo Item 3' },
    { label = 'Demo Item 4', value = 'demo4', description = 'Demo Item 4' }
}})

--- Events
confirm:On('confirm', function(item) print('YOU ACCEPTED THE TERMS') end)
confirm:On('deny', function(item) print('YOU DENIED THE TERMS') end)

range:On('select', function(item, value) print(('FROM %s to %s YOU SELECTED %s'):format(item.Min, item.Max, value)) end)
range:On('change', function(item, newValue, oldValue)
    menu.Title = ('MenuV %s'):format(newValue)
end)

slider:On('select', function(item, value) print(('YOU SELECTED %s'):format(value)) end)

confirm:On('enter', function(item) print('YOU HAVE NOW A CONFIRM ACTIVE') end)
confirm:On('leave', function(item) print('YOU LEFT OUR CONFIRM :(') end)

menu:On('switch', function(item, currentItem, prevItem) print(('YOU HAVE SWITCH THE ITEMS FROM %s TO %s'):format(prevItem.__type, currentItem.__type)) end)

menu2:On('open', function(m)
    m:ClearItems()

    for i = 1, 10, 1 do
        math.randomseed(GetGameTimer() + i)

        m:AddButton({ ignoreUpdate = i ~= 10, icon = '❤️', label = ('Open Menu %s'):format(math.random(0, 1000)), value = menu, description = ('YEA! ANOTHER RANDOM NUMBER: %s'):format(math.random(0, 1000)), select = function(i) print('YOU CLICKED ON THIS ITEM!!!!') end })
    end
end)

menu()

RegisterCommand("menutest", function(source, args, fullCommand)
    print ("test")
    MenuV:OpenMenu(menu)
    print ("test2")
end, false)


I think you forgot to add menuv to your server.cfg

start menuv

Add that before the resources that’s uses menuv. I tried your code and it worked fine for me.

1 Like

No, I started MenuV correctly, because I can see the case settings of MenuV in the button settings

I executed your code without changes and had 0 problems, for now your issues is not reproducible