Benjis RP UI Framework

A lightweight (hopefully), performance-based (hopefully again), consistent UI framework for Benji's Downtown & Dev servers.

Quick Start Example

local frame = Benjis.UI:CreateFrame("Example Menu", 900, 600, "center")

local panel = Benjis.UI:CreatePanel(frame.Content, "panel")
panel:Dock(FILL)
panel:DockMargin(Benjis.UI.Padding, Benjis.UI.Padding, Benjis.UI.Padding, Benjis.UI.Padding)

local btn = Benjis.UI:CreateButton(panel, "Click Me")
btn:Dock(TOP)
btn.DoClick = function()
    print("Button clicked")
end

Theme System (cl_theme.lua)

Benjis.UI.Theme = {
    BG        = Color(18,18,18,235),
    Panel     = Color(25,25,25,220),
    Hover     = Color(35,35,35,220),
    Accent    = Color(200,60,60),
    Divider   = Color(0,0,0,180),
    Text      = color_white,
    Muted     = Color(160,160,160)
}

Benjis.UI.AnimTime = 0.25
Benjis.UI.Padding  = 12

All visual styling should come from this table. Avoid hardcoding colors.

Windows & Frames (cl_window.lua)

Create Frame

local frame = Benjis.UI:CreateFrame("F4 Menu", 1000, 700, "sidebar")

Adding Content

local content = frame.Content

local card = Benjis.UI:CreatePanel(content, "card")
card:Dock(TOP)
card:SetTall(120)
card:DockMargin(12, 12, 12, 0)

Panels (cl_panel.lua)

Panel Styles Example

Benjis.UI:CreatePanel(parent, "panel")
Benjis.UI:CreatePanel(parent, "bg")
Benjis.UI:CreatePanel(parent, "transparent")
Benjis.UI:CreatePanel(parent, "card")

Buttons (cl_button.lua)

Basic Button

local btn = Benjis.UI:CreateButton(parent, "Save Settings")
btn:Dock(TOP)

btn.DoClick = function()
    RunConsoleCommand("say", "Saved!")
end

Button List Example

for i = 1, 5 do
    local btn = Benjis.UI:CreateButton(parent, "Option " .. i)
    btn:Dock(TOP)
end

Fonts (cl_fonts.lua)

Using a Font Preset

draw.SimpleText(
    "Hello World",
    Benjis.UI:GetFontPreset("Header"),
    20, 20,
    Benjis.UI.Theme.Text
)

Registering a Custom Preset

Benjis.UI:RegisterFontPreset("Huge", {
    font = "Tahoma",
    size = 28,
    options = { weight = 900 }
})

Scroll Panels (cl_scroll.lua)

Scrollable List Example

local scroll = Benjis.UI:CreateScroll(parent)
scroll:Dock(FILL)

for i = 1, 20 do
    local btn = Benjis.UI:CreateButton(scroll, "Item " .. i)
    btn:Dock(TOP)
end

Lists (cl_list.lua)

Player List Example

local list = Benjis.UI:CreateList(parent)

for _, ply in ipairs(player.GetAll()) do
    Benjis.UI:AddListRow(
        list,
        ply:Nick(),
        team.GetColor(ply:Team())
    )
end

The stripColor argument is optional and can be any Color.

Model Panels (cl_model.lua)

Model Preview Example

local mdl = Benjis.UI:CreateModelPanel(parent, "models/player/kleiner.mdl")
mdl:SetSize(200, 300)
mdl:Dock(LEFT)

Best Practices