본문으로 건너뛰기

ProgressBar

ProgressBar(프로그레스바) 위젯은 작업이 어느 정도 진행됐는지를 원형 또는 막대 형태로 보여주는 진행 표시기입니다.
다운로드·로딩·업로드처럼 완료까지 시간이 걸리는 동작의 상태를 사용자에게 시각적으로 알릴 때 사용합니다.

정의 / 역할

ProgressBar 위젯은 진행 상태를 원형(도넛) 또는 막대(라인) 형태로 그려줍니다. 진행률(value)을 0~1 사이 값으로 지정하면 그 비율만큼 채워지고, 지정하지 않으면 완료 시점을 알 수 없는 무한(불확정) 애니메이션으로 계속 움직입니다. 진행 색과 배경(트랙) 색, 그리고 형태별 세부 모양을 설정할 수 있습니다.

  • 카테고리: Contents
  • 기본 형태: 원형(Circular)
  • 기본 진행률: 미지정 (무한 애니메이션)

기능

기능설명
진행 표시 방식원형 또는 막대 형태 중 하나로 진행 상태를 표시합니다.
진행률 표시value(0~1)를 지정하면 해당 비율만큼 채워집니다. 지정하지 않으면 완료 시점을 알 수 없는 무한(불확정) 애니메이션으로 표시됩니다.
색상 설정진행 부분 색(color)과 트랙 배경색(backgroundColor)을 각각 설정합니다.
형태별 모양 조정원형은 선 두께 등을, 막대는 높이·모서리 둥글기를 조정합니다.
접근성스크린리더가 읽을 라벨·값을 지정합니다.

사용 방법

  1. 왼쪽 위젯 팔레트에서 Contents 카테고리를 엽니다.
  2. ProgressBar 항목을 캔버스로 끌어다 놓습니다.
  3. 오른쪽 속성 패널에서 형태(type)를 원형·막대 중에서 선택합니다.
  4. 진행률을 고정하려면 value에 0~1 사이 값을 지정합니다. (비워 두면 무한 애니메이션으로 표시됩니다.)
  5. 필요하면 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 문서에서 확인하세요.