[flutter] 플러터 ProgressIndicator의 색상과 크기를 조절하는 방법은?

플러터 앱을 개발하다보면 ProgressIndicator의 색상과 크기를 조절해야 하는 경우가 있습니다. 이를 위해 다음과 같은 방법을 사용할 수 있습니다.

1. ProgressIndicator의 색상 조절

ProgressIndicator의 색상을 조절하기 위해서는 LinearProgressIndicator 또는 CircularProgressIndicator 위젯의 valueColor 속성을 활용합니다.

LinearProgressIndicator(
  valueColor: AlwaysStoppedAnimation<Color>(Colors.blue),
)

또는

CircularProgressIndicator(
  valueColor: AlwaysStoppedAnimation<Color>(Colors.green),
)

valueColor 속성을 통해AlwaysStoppedAnimation을 사용하여 색상을 설정할 수 있습니다.

2. ProgressIndicator의 크기 조절

ProgressIndicator의 크기를 조절하기 위해서는 LinearProgressIndicator 또는 CircularProgressIndicator 위젯의 valueColor 속성을 조절할 수 있습니다.

LinearProgressIndicator(
  minHeight: 10,
)

또는

CircularProgressIndicator(
  strokeWidth: 5,
)

minHeightstrokeWidth 속성을 활용하여 각각 선형 및 원형 ProgressIndicator의 크기를 설정할 수 있습니다.

위와 같은 방법을 활용하여 ProgressIndicator의 색상과 크기를 쉽게 조절할 수 있습니다.

참고 자료