bg_progress_indicator 0.0.2

A fully customizable circular progress indicator for Flutter with gradient, range colors, dynamic updates, and more.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:bg_progress_indicator/bg_progress_indicator.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const DemoPage(),
    );
  }
}

class DemoPage extends StatefulWidget {
  const DemoPage({super.key});

  @override
  State<DemoPage> createState() => _DemoPageState();
}

class _DemoPageState extends State<DemoPage> {
  double progress = 20;

  void increaseProgress() {
    setState(() {
      progress += 10;
      if (progress > 100) progress = 0;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("BG Progress Indicator Demo")),
      body: Padding(
        padding: const EdgeInsets.all(20),
        child: Column(
          children: [
            // Basic Gradient Indicator
            BGProgressIndicator(
              percentage: 75,
              showPercentageText: true,
              tag: "Goal",
              gradientColors: [Colors.purple, Colors.blue],
            ),

            const SizedBox(height: 30),

            // Range-based Colors
            BGProgressIndicator(
              percentage: 45,
              showPercentageText: true,
              tag: "Health",
              rangeColors: [
                IndicatorRangeColor(start: 0, end: 30, color: Colors.red),
                IndicatorRangeColor(start: 30, end: 60, color: Colors.orange),
                IndicatorRangeColor(start: 60, end: 100, color: Colors.green),
              ],
            ),

            const SizedBox(height: 30),

            // Dynamic Progress Example
            BGProgressIndicator(
              percentage: progress,
              showPercentageText: true,
              tag: "Dynamic",
              rangeColors: [
                IndicatorRangeColor(start: 0, end: 30, color: Colors.red),
                IndicatorRangeColor(start: 30, end: 60, color: Colors.orange),
                IndicatorRangeColor(start: 60, end: 100, color: Colors.green),
              ],
            ),

            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: increaseProgress,
              child: const Text("Increase Progress"),
            ),
          ],
        ),
      ),
    );
  }
}