Виджет CircularProgressIndicator

Виджет CircularProgressIndicator показывает кольцо прогресса по центру или в кнопке. Долю заполнения задают в value от 0 до 1, без value кольцо крутится бесконечно, цвет - в color, толщину - в strokeWidth.

Синтаксис

CircularProgressIndicator(
	value: 0.6,
	strokeWidth: 4,
)

Параметры

Параметр	Описание
`value`	Доля окружности. Null: неопределённая загрузка.
`color`	Цвет дуги.
`strokeWidth`	Толщина линии кольца.

Пример

Давайте покажем бесконечную загрузку:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(child: CircularProgressIndicator()),
			),
		),
	);
}

По центру крутится кольцо без числа процентов.

Пример

Давайте зададим value 0.25:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: CircularProgressIndicator(value: 0.25),
				),
			),
		),
	);
}

Кольцо заполнено на четверть окружности.

Смотрите также

виджет LinearProgressIndicator,
горизонтальная полоса прогресса
виджет RefreshIndicator,
который показывает индикатор при pull-to-refresh
виджет ElevatedButton,
внутрь которого кладут маленький индикатор
виджет SizedBox,
которым задают размер индикатора