ProgressBar
ProgressBar(프로그레스바) 위젯은 작업이 어느 정도 진행됐는지를 원형 또는 막대 형태로 보여주는 진행 표시기입니다.
다운로드·로딩·업로드처럼 완료까지 시간이 걸리는 동작의 상태를 사용자에게 시각적으로 알릴 때 사용합니다.
정의 / 역할
ProgressBar 위젯은 진행 상태를 원형(도넛) 또는 막대(라인) 형태로 그려줍니다. 진행률(value)을 0~1 사이 값으로 지정하면 그 비율만큼 채워지고, 지정하지 않으면 완료 시점을 알 수 없는 무한(불확정) 애니메이션으로 계속 움직입니다. 진행 색과 배경(트랙) 색, 그리고 형태별 세부 모양을 설정할 수 있습니다.
- 카테고리: Contents
- 기본 형태: 원형(Circular)
- 기본 진행률: 미지정 (무한 애니메이션)
기능
| 기능 | 설명 |
|---|---|
| 진행 표시 방식 | 원형 또는 막대 형태 중 하나로 진행 상태를 표시합니다. |
| 진행률 표시 | value(0~1)를 지정하면 해당 비율만큼 채워집니다. 지정하지 않으면 완료 시점을 알 수 없는 무한(불확정) 애니메이션으로 표시됩니다. |
| 색상 설정 | 진행 부분 색(color)과 트랙 배경색(backgroundColor)을 각각 설정합니다. |
| 형태별 모양 조정 | 원형은 선 두께 등을, 막대는 높이·모서리 둥글기를 조정합니다. |
| 접근성 | 스크린리더가 읽을 라벨·값을 지정합니다. |
사용 방법
- 왼쪽 위젯 팔레트에서 Contents 카테고리를 엽니다.
- ProgressBar 항목을 캔버스로 끌어다 놓습니다.
- 오른쪽 속성 패널에서 형태(
type)를 원형·막대 중에서 선택합니다. - 진행률을 고정하려면
value에 0~1 사이 값을 지정합니다. (비워 두면 무한 애니메이션으로 표시됩니다.) - 필요하면
color·backgroundColor로 색을 바꾸고, 원형은 선 두께를, 막대는 높이·모서리 둥글기를 조정합니다.
속성 (Property)
| 속성 | 설명 | 기본값 | 값 / 타입 |
|---|---|---|---|
type | 진행 표시 형태. 원형은 선 두께 등, 막대는 높이·모서리 둥글기 같은 형태별 세부 설정을 함께 가집니다. | 원형(Circular) | 원형 / 막대 |
value | 진행률. 지정하지 않으면 무한(불확정) 애니메이션으로 표시됩니다. | 미지정 | 숫자 (0.0 ~ 1.0) |
backgroundColor | 트랙(배경) 색 | 미지정 | 색상 |
color | 진행 부분(채워지는 부분)의 색 | 미지정 | 색상 |
semanticsLabel | 스크린리더용 접근성 라벨 | 미지정 | 문자열 |
semanticsValue | 스크린리더용 접근성 값 | 미지정 | 문자열 |
주의 / 팁
경고
value를 지정하지 않으면 완료 시점을 알 수 없는 무한(불확정) 애니메이션으로 표시됩니다. 진행률을 눈에 보이게 채우려면 01 사이 값을 지정하세요. 이 범위를 벗어난 값은 자동으로 01로 보정됩니다.
팁
조정할 수 있는 세부 모양은 형태에 따라 다릅니다. 원형은 선 두께 등을, 막대는 높이와 모서리 둥글기를 설정할 수 있습니다.
더 알아보기
팁
이 위젯을 스크립트로 제어하는 Widget Control(Property·Method·Event) 전체는 ProgressBar (프로그레스바) Widget Control 문서에서 확인하세요.