---
sourceType: official-guide
sourceTypeMatchedRule: fallback
slug: MA/zaui/display/Progress
title: Progress
---
```ts
import { Progress } from "zmp-ui";
```


Dùng để báo cáo tiến trình của một tác vụ dài.

## Ví dụ



## Bảng thuộc tính


| Tên | Type | Required | Default | Mô tả |
| --- | --- | --- | --- | --- |
| maxCompleted | number | No | 100 | Giá trị tối đa của thanh tiến trình, cũng là mốc hoàn tất. |
| completed | number | No | 0 | Giá trị hiện tại của thanh tiến trình. |
| formatLabel | (current: number, maxCompleted: number) => React.ReactNode | No |  | Hàm được dùng để tuỳ chỉnh nội dung được hiển thị trên nhãn. Cần được sử dùng cùng với `showLabel`. |
| showLabel | boolean | No | false | Nhãn của tiến trình, được hiển thị bên phải thanh tiến trình. |
| strokeWidth | number | No | 4 | Độ dày của thanh tiến trình, tính theo đơn vị px. |
| strokeColor | string | No |  | Màu của phần đã hoàn tất trên thanh tiến trình. |
| trailColor | string | No |  | Màu của phần chưa hoàn tất trên thanh tiến trình. |