A bold circular progress widget with a thick donut stroke, clean center percentage, and a distinct start gap for easy reading. Supports solid or two-tone sweeps, smooth animations, and full theming—perfect for KPIs, goals, and usage meters in FlutterFlow.
Functionality
-
Thick donut ring with configurable stroke width and inner radius.
-
Start gap / notch for clear origin; set start angle and direction.
-
Solid or two-tone sweep (light/dark accents) along the active arc.
-
Center label (percent, value + units, or custom text).
-
Animated progress with tunable duration and easing.
-
Value range: bind to 0–100% or custom min/max.
-
Threshold palettes (success/warning/danger) or brand colors.
-
Shadow/glow options for depth on dark or light backgrounds.
-
Tap/long-press actions to open details or refresh data.
-
Accessible semantics (announces value/state to screen readers).
-
Light/Dark ready with high-contrast text.
-
Data-ready: Firestore / Supabase / REST / local state integration.
-
Performance-minded: GPU-accelerated drawing, minimal rebuilds.
Great for: KPI cards, storage/quota meters, habit & fitness goals, course/task completion, uptime/health indicators, onboarding progress, and dashboard summaries.
Keywords: FlutterFlow progress, circular progress, donut progress, ring progress, radial progress, thick stroke, start gap, start angle, clockwise, counterclockwise, two-tone sweep, gradient arc, percentage label, value label, threshold colors, success warning danger, animated progress, easing, KPI widget, goal tracker, usage meter, storage meter, fitness progress, habit tracker, uptime indicator, dashboard component, light mode, dark mode, accessible UI, data binding, Firestore, Supabase, REST API, Flutter widget, FlutterFlow component, modern UI, premium design, performance optimized.