Spinner
An indeterminate activity indicator driven by TickMsg. Supply any list of frames — Braille dots, a line spinner, moons, clocks — and forward ticks to advance it.
Install the package
Every component ships in the single dart_tui package.
$dart pub add dart_tui
import 'package:dart_tui/dart_tui.dart';
const dots = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
final class LoadingModel extends TeaModel {
LoadingModel({SpinnerModel? spinner})
: spinner = spinner ?? SpinnerModel(frames: dots, prefix: 'Loading ');
final SpinnerModel spinner;
// Kick off the animation.
@override
Cmd? init() => tick(const Duration(milliseconds: 100), (_) => TickMsg());
@override
(Model, Cmd?) update(Msg msg) {
if (msg is TickMsg) {
final (next, _) = spinner.update(msg);
return (
LoadingModel(spinner: next as SpinnerModel),
tick(const Duration(milliseconds: 100), (_) => TickMsg()),
);
}
return (this, null);
}
@override
View view() => newView(spinner.view().content);
}SpinnerModel
| Property | Type | Description |
|---|---|---|
| frames | List<String> | Animation frames cycled on each TickMsg. Defaults to the Braille dot set. |
| index | int | Current frame index. |
| prefix | String | Text rendered before the spinner glyph. |
| suffix | String | Text rendered after the spinner glyph. |
| styles | SpinnerStyles | Foreground styling for the spinner and its label. |