A playful ⚽️ pill-shaped linear meter that feels alive — our image marker progress bar widget slides a soccer-ball thumb across a turf-green track 🌱 as progress grows. Smooth, fast, and totally themeable—perfect for sports apps, gamified onboarding, challenges, and any UI that needs instant personality. 🚀

Functionality

• 🌿 Grass-textured fill in a rounded track for a stadium vibe.

• ⚽️ Ball thumb marker that animates smoothly with progress.

• 🔢 Inline % label (show/hide, inside/outside placement).

• 🎚️ Configurable range & step: 0–100% or custom min/max.

• 🎞️ Animated progress with tunable duration & easing.

• ↔️ LTR/RTL direction: left→right or right→left.

• 🧱 Track styling: thickness, radius, border, shadow, background tint.

• 🎨 Theme options: swap textures/colors (team colors, gradients).

• 🚦 Threshold rules: success / warning / danger color logic.

• 🪝 Callbacks: onChange / onComplete for rewards & flows.

• 🔗 Data-ready: bind from Firestore / Supabase / REST / local state.

• ♿ Accessible labels, plus Light/Dark support.

• ⚡ Performance-minded: GPU-accelerated, minimal rebuilds.

• 📱 Responsive: scales from tiny cards to full-width status bars.

Great for: match trackers, fan engagement, training goals, challenge meters, fitness progress, loyalty levels, and any sports-themed KPI. 🏆

Keywords: image marker progress bar widget, soccer progress bar, football progress bar, linear progress, pill bar, grass texture, ball thumb, percentage label, animated progress, gamified ui, sports app widget, match tracker, goal meter, stamina bar, challenge meter, fitness progress, fan engagement, themed progress, team colors, gradient fill, threshold colors, rtl support, responsive design, flutterflow component, flutterflow widget, data binding, firestore, supabase, rest api, accessibility, dark mode, light mode, microinteractions, smooth animation, mobile ui, dashboard widget.