Exemple complet
Par
Sören
v1.0.6L’exemple suivant regroupe un menu, un sous-menu et plusieurs composants :
lua
local Menu = zUI.CreateMenu(
"Menu exemple",
"zUI",
"Présentation des composants",
nil,
"F1",
"Ouvrir le menu exemple."
)
local subMenu = zUI.CreateSubMenu(
Menu,
"Sous-menu",
"Options",
"Composants avancés"
)
local checkboxState = false
local percentage = 0
local index = 1
local colorListIndex = 1
Menu:SetItems(function(Items)
Items:AddSeparator("Composants")
Items:AddLine()
Items:AddButton(
"Ouvrir le sous-menu",
"Afficher les composants avancés.",
{},
function(onSelected, onHovered)
end,
subMenu
)
Items:AddLinkButton(
"Site internet",
"Visiter le site de la zSquad.",
{},
"https://zsquad.fr"
)
Items:AddCheckbox(
"Checkbox",
"Active ou désactive une option.",
checkboxState,
{},
function(onSelected, onHovered)
if onSelected then
checkboxState = not checkboxState
end
end
)
Items:AddSlider(
"Pourcentage",
"Modifier une valeur.",
percentage,
10,
{},
function(onSelected, onHovered, onChange, newPercentage)
if onChange then
percentage = newPercentage
end
end
)
Items:AddList(
"Liste",
"Choisissez un élément.",
index,
{ "Item #1", "Item #2" },
{},
function(onSelected, onHovered, onListChange, newIndex)
if onListChange then
index = newIndex
end
end
)
Items:AddColorList(
"Couleur",
"Choisissez une couleur.",
colorListIndex,
{
"#00ff00",
"#fffd2c",
"#ff00ff",
"#ff0000",
"#0000ff"
},
{},
function(onSelected, onHovered, onListChange, newIndex)
if onListChange then
colorListIndex = newIndex
end
end
)
end)
subMenu:SetItems(function(Items)
Items:AddSeparator("Sous-menu", "right")
Items:AddLine()
Items:AddButton(
"Ouvrir une modale",
"Afficher un formulaire.",
{},
function(onSelected, onHovered)
if onSelected then
local values = zUI.ShowModal("Informations", {
{
type = "text",
name = "Texte",
description = "Saisissez une valeur.",
isRequired = false,
minLength = 4,
maxLength = 15
},
{
type = "number",
name = "Nombre",
isRequired = false
},
{
type = "checkbox",
name = "Checkbox",
defaultValue = true
},
{
type = "colorpicker",
name = "Couleur",
defaultValue = "#faad2c"
},
{
type = "date",
name = "Date",
format = "DD/MM/YYYY"
}
}, {})
print(values[1])
end
end
)
end)
Menu:OnOpen(function()
print("Menu ouvert")
end)
Menu:OnClose(function()
print("Menu fermé")
end)Vous pouvez utiliser cette base dans une ressource client puis remplacer progressivement les composants par ceux de votre propre script.