Progress
A flexible, lightweight, and animated progress bar system for FiveM. Supports 2D HUD bars, 3D in-world bars, animations, prop attachments, and control disabling.
🛠️ Core Functions
You can access the progress bar using exports.
ShowProgress (Standard 2D)
The "Fire and Forget" method. Handles the timer, animation, and cleanup automatically.
exports['ak47_lib']:ShowProgress(data, onFinish, onCancel)| Parameter | Type | Description |
|---|---|---|
data |
table |
Configuration object (see below). |
onFinish |
function |
(Optional) Callback when the bar reaches 100%. |
onCancel |
function |
(Optional) Callback if the bar is cancelled (e.g., player moved or pressed X). |
CancelProgress (Standard 2D)
Cancel the running 2d progress.
exports['ak47_lib']:CancelProgress()CreateProgress (Advanced 3D)
Returns a Progress Object that you must manually control. Useful for minigames, persistent HUD elements, or skills where progress isn't time-based.
local bar = exports['ak47_lib']:CreateProgress(data)Object Methods:
bar.show(): Displays the bar.bar.update(value): Sets the percentage (0-100).bar.destroy(): Removes the bar immediately.
📦 Data Object Configuration
The data table defines how the progress bar looks and behaves.
Basic Settings
| Property | Type | Default | Description |
|---|---|---|---|
label |
string | "Progress" | Text displayed on the bar. |
duration |
number | 3000 | Time in milliseconds (if not manual). |
type |
string | "capsule" | Visual style (see Styles below). |
canCancel |
boolean | false | If true, pressing X (73) cancels the action. |
reverse |
boolean | false | If true, the bar goes from 100% to 0%. |
3D World Options
| Property | Type | Default | Description |
|---|---|---|---|
is3d |
boolean | false | If true, the bar floats in the world. |
coords |
vector3 | Player Pos | World coordinates for the bar. |
distance |
number | 10.0 | Max visibility distance for 3D bars. |
State Restrictions
| Property | Type | Default | Description |
|---|---|---|---|
useWhileDead |
boolean | false | Cancel if player dies? |
allowSwimming |
boolean | false | Cancel if player enters water? |
allowFalling |
boolean | false | Cancel if player falls? |
allowRagdoll |
boolean | false | Cancel if player gets ragdolled? |
Control Disabling (disable sub-table)
Prevent player input while the bar is active.
disable = {
move = true, -- Disables WASD / Jumping
mouse = true, -- Disables Camera Look
combat = true, -- Disables Shooting / Aiming
car = true, -- Disables Entering / Exiting Vehicles
sprint = true -- Disables Sprinting
}Animation (anim sub-table)
Play an animation or scenario.
anim = {
dict = "amb@world_human_gardener_plant@male@base",
clip = "base",
flag = 49, -- Animation flag (default 49)
blendIn = 3.0, -- Speed to blend in
scenario = "WORLD_HUMAN_WELDING" -- (Alternative to dict/clip)
}Props (prop sub-table)
Attach one or more objects to the player.
prop = {
model = "prop_tool_wrench",
bone = 28422, -- Bone Index (Right Hand)
pos = vec3(0.0, 0.0, 0.0), -- Position Offset
rot = vec3(0.0, 0.0, 0.0) -- Rotation Offset
}🎨 Visual Styles
You can change the appearance of the progress bar by setting the type field in the data object.
| Type | Description |
|---|---|
capsule |
![]() |
minimal |
![]() |
segments |
![]() |
pulse |
![]() |
radial-smooth |
![]() |
radial-orbit |
![]() |
radial-ticks |
![]() |
radial-dashed |
![]() |
📝 Examples
Example 1: Basic Repair (Linear)
Simple interaction with a callback.
exports['ak47_lib']:ShowProgress({
duration = 5000,
label = "Repairing Engine",
type = "capsule",
anim = {
dict = "mini@repair",
clip = "fixing_a_ped"
}
}, function()
print("Repair Complete!")
-- Add repair logic here
end, function()
print("Repair Cancelled")
end)Example 2: Medical Action (Complex)
Uses props, animations, and disables controls.
exports['ak47_lib']:ShowProgress({
duration = 7000,
label = "Applying Bandage",
type = "radial-smooth",
canCancel = true,
disable = {
move = true,
combat = true
},
anim = {
dict = "missheistdockssetup1clipboard@idle_a",
clip = "idle_a",
flag = 49
},
prop = {
model = "prop_paper_bag_small",
bone = 28422,
pos = vec3(0.1, 0.0, 0.0),
rot = vec3(0.0, 0.0, 0.0)
}
}, function()
TriggerServerEvent('medical:heal')
end)Example 3: Manual HUD (Object Oriented)
Useful for skill checks or minigames where the script controls the percentage.
-- 1. Create the bar object
local myBar = exports['ak47_lib']:CreateProgress({
label = "Overheating",
type = "segments",
manual = true, -- IMPORTANT: Disables auto-timer
initial = 0
})
-- 2. Show it
myBar.show()
-- 3. Update it in your own loop
CreateThread(function()
local heat = 0
while heat < 100 do
heat = heat + 1
myBar.update(heat) -- Update UI
Wait(100)
end
-- 4. Destroy it when done
myBar.destroy()
end)Example 4: 3D World Progress
Attach a progress bar to a specific coordinate in the world (e.g., a door being drilled).
local doorCoords = vector3(120.5, -150.2, 30.0)
exports['ak47_lib']:ShowProgress({
duration = 10000,
label = "Drilling Lock",
type = "radial-orbit",
is3d = true, -- Enable 3D mode
coords = doorCoords, -- Where to show the bar
distance = 15.0, -- Visible distance
anim = {
scenario = "WORLD_HUMAN_WELDING"
}
}, function()
print("Door Opened")
end)






