Создаем портфолио за 1 месяц
К концу месяца: 4 классных проекта в вашем портфолио! Стоимость: 100$. Подробности...
⊗flPmAwIn 111 of 125 menu
◀ ▶

Индикатор загрузки CircularProgressIndicator в Flutter

Пользователю нужно видеть, что приложение не зависло. Круговой индикатор Material - CircularProgressIndicator. Его ставят по центру или рядом с текстом «Загрузка…».

Без параметров рисуется бесконечная анимация. Цвет можно взять из Theme.of(context).colorScheme.primary. Для известного процента есть CircularProgressIndicator(value: 0.4):

import 'package:flutter/material.dart'; void main() { runApp(const MaterialApp(home: LoadingDemoPage())); } class LoadingDemoPage extends StatefulWidget { const LoadingDemoPage({super.key}); @override State<LoadingDemoPage> createState() => _LoadingDemoPageState(); } class _LoadingDemoPageState extends State<LoadingDemoPage> { bool loading = true; @override void initState() { super.initState(); Future<void>.delayed(const Duration(seconds: 2), () { if (!mounted) return; // no setState after dispose setState(() { loading = false; }); }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: const Text('Loading')), body: Center( child: loading ? const CircularProgressIndicator() : const Text('Done'), ), ); } }

Покажите индикатор и подпись 'Please wait' в Column. Через три секунды замените блок на 'Data received'.

← →
↑
Мы используем cookie для работы сайта, аналитики и персонализации. Обработка данных происходит согласно Политике конфиденциальности.
принять все настроить отклонить