> For the complete documentation index, see [llms.txt](https://zsx-development.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://zsx-development.gitbook.io/docs/resources/user-interface-v2/exports/interfaces/progress-bar.md).

# Progress Bar

### Add

In order to add progress bar you can use the following code:

{% code overflow="wrap" fullWidth="false" %}

```lua
exports['ZSX_UIV2']:ProgressBar(icon, text, duration, onComplete, onCancel, canCancel, disableControls, anim, prop1, prop2)
```

{% endcode %}

<table data-full-width="false"><thead><tr><th width="178">Arg</th><th width="581">Information</th></tr></thead><tbody><tr><td>icon</td><td><mark style="color:green;">String</mark><br>Icon of the progress bar. <a href="https://fontawesome.com/v5/search?q=">Icons list</a>.</td></tr><tr><td>text</td><td><mark style="color:green;">String</mark><br>Text of the task</td></tr><tr><td>duration</td><td><mark style="color:blue;">Number</mark><br>Duration of the task</td></tr><tr><td>onComplete</td><td><mark style="color:purple;">Function</mark><br>Called at the end of task</td></tr><tr><td>onCancel</td><td><mark style="color:purple;">Function</mark><br>Called at the interruption of the task</td></tr><tr><td>canCancel</td><td><mark style="color:orange;">Boolean</mark><br>Whether user can cancel task or not.</td></tr><tr><td>disableControls</td><td><mark style="color:yellow;">Object</mark><br>Disable each control</td></tr><tr><td>anim</td><td><mark style="color:yellow;">Object</mark><br>Creating animation</td></tr><tr><td>prop1</td><td><mark style="color:yellow;">Object</mark><br>Creates prop #1</td></tr><tr><td>prop2</td><td><mark style="color:yellow;">Object</mark><br>Creates prop #2</td></tr></tbody></table>

### disableControls object

<table><thead><tr><th width="169">key</th><th width="468">value</th><th data-type="checkbox">Optional</th></tr></thead><tbody><tr><td>disable_mouse</td><td><mark style="color:orange;">Boolean</mark><br>Disable mouse movement</td><td>true</td></tr><tr><td>disable_walk</td><td><mark style="color:orange;">Boolean</mark><br>Disable player movement</td><td>true</td></tr><tr><td>disable_driving</td><td><mark style="color:orange;">Boolean</mark><br>Disable vehicle movement</td><td>true</td></tr><tr><td>disable_combat</td><td><mark style="color:orange;">Boolean</mark><br>Disable combat</td><td>true</td></tr></tbody></table>

### anim object

<table><thead><tr><th width="169">key</th><th width="468">value</th><th data-type="checkbox">Optional</th></tr></thead><tbody><tr><td>dict</td><td><mark style="color:green;">String</mark><br>Dictionary of animation</td><td>false</td></tr><tr><td>clip</td><td><mark style="color:green;">String</mark><br>Clip set of animation</td><td>false</td></tr><tr><td>blendIn</td><td><mark style="color:blue;">Number</mark><br>Blend In</td><td>true</td></tr><tr><td>blendOut</td><td><mark style="color:blue;">Number</mark><br>Blend Out</td><td>true</td></tr><tr><td>duration</td><td><mark style="color:blue;">Number</mark><br>Duration of animation</td><td>true</td></tr><tr><td>flag</td><td><mark style="color:blue;">Number</mark><br>Flags</td><td>true</td></tr><tr><td>playbackRate</td><td><mark style="color:blue;">Number</mark><br>Playback Rate</td><td>true</td></tr><tr><td>lockX</td><td><mark style="color:orange;">Boolean</mark><br>Lock X axis</td><td>true</td></tr><tr><td>lockY</td><td><mark style="color:orange;">Boolean</mark><br>Lock Y axis</td><td>true</td></tr><tr><td>lockZ</td><td><mark style="color:orange;">Boolean</mark><br>Lock Z axis</td><td>true</td></tr></tbody></table>

### prop object

<table><thead><tr><th width="169">key</th><th width="468">value</th><th data-type="checkbox">Optional</th></tr></thead><tbody><tr><td>model</td><td><mark style="color:green;">String</mark> / <mark style="color:purple;">Hash</mark><br>Model of the prop</td><td>false</td></tr><tr><td>bone</td><td><mark style="color:green;">String</mark><br>Bone to attach</td><td>true</td></tr><tr><td>pos</td><td><mark style="color:blue;">Vector /</mark> <mark style="color:yellow;">Object</mark><br>Offset of the object</td><td>true</td></tr><tr><td>rot</td><td><mark style="color:blue;">Vector /</mark> <mark style="color:yellow;">Object</mark><br>Rotation of the object</td><td>true</td></tr></tbody></table>
