Determinate Progress

1class DeterminateProgressExample extends StatefulWidget {
2  @override
3  State<DeterminateProgressExample> createState() =>
4      _DeterminateProgressExampleState();
5}
6
7class _DeterminateProgressExampleState
8    extends State<DeterminateProgressExample> {
9  late Timer _timer = Timer(
10    const Duration(seconds: 1),
11    () => setState(() => _value = 0.7),
12  );
13  double _value = 0.2;
14
15  @override
16  void dispose() {
17    _timer.cancel();
18    super.dispose();
19  }
20
21  @override
22  Widget build(BuildContext _) => Column(
23    mainAxisAlignment: .center,
24    spacing: 20,
25    children: [
26      FDeterminateProgress(value: _value),
27      Row(
28        mainAxisAlignment: .end,
29        children: [
30          FButton(
31            variant: .outline,
32            size: .sm,
33            mainAxisSize: .min,
34            child: const Text('Reset'),
35            onPress: () => setState(() {
36              _value = 0.2;
37              _timer.cancel();
38              _timer = Timer(
39                const Duration(seconds: 1),
40                () => setState(() => _value = 0.7),
41              );
42            }),
43          ),
44        ],
45      ),
46    ],
47  );
48}
49

CLI

To generate a specific style for customization:

dart run forui style create determinate-progress

Usage

`FDeterminateProgress(...)`

1FDeterminateProgress(
2  style: .delta(constraints: .tightFor(height: 10.0)),
3  semanticsLabel: 'Loading 50%',
4  value: 0.5,
5)

Determinate Progress

CLI

Usage

FDeterminateProgress(...)

On this page

`FDeterminateProgress(...)`