progress_loader_reloaded.dart

// custom_circle.dart

import 'package:flutter/material.dart';
import 'package:vector_math/vector_math.dart' as vector_math;

class CustomCircle extends CustomPainter {
  Paint circlePaint = Paint()
    ..color = Colors.grey.shade800
    ..style = PaintingStyle.stroke
    ..strokeWidth = 10;

  Paint progressPaint;

  double circleRadius = 50;

  final double animationValue;
  final double progress;
  final Color progressColor;
  final double oldProgress;

  CustomCircle(
      {this.progress = 0,
      this.oldProgress,
      this.progressColor = Colors.red,
      this.animationValue})
      : assert(progress >= 0 && progress <= 100) {
    progressPaint = Paint()
      ..color = progressColor
      ..strokeCap = StrokeCap.round
      ..style = PaintingStyle.stroke
      ..strokeWidth = 10;
  }

  @override
  void paint(Canvas canvas, Size size) {
    double w = size.width;
    double h = size.height;

    Offset center = Offset(w / 2, h / 2);

    canvas.drawCircle(center, circleRadius, circlePaint);
    canvas.drawArc(
      Rect.fromCircle(center: center, radius: circleRadius),
      vector_math.radians(-90),
      vector_math.radians(animationValue * progress * 3.6),
      false,
      progressPaint,
    );
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => true;
}

// main.dart

import 'dart:math';

import 'package:custom_view/composition_widget.dart';
import 'package:custom_view/custom_circle.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: CustomPage(),
    );
  }
}

class CustomPage extends StatefulWidget {
  @override
  _CustomPageState createState() => _CustomPageState();
}

class _CustomPageState extends State<CustomPage>
    with SingleTickerProviderStateMixin {
  AnimationController _animationController;
  Animation _animation;

  double oldValue = 0.0;
  double currentValue = 0.0;

  Random random = Random();

  @override
  void initState() {
    super.initState();
    _animationController =
        AnimationController(duration: Duration(seconds: 1), vsync: this)
          ..addListener(() {
            if (_animationController.isCompleted) {}
          });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Container(
              child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              AnimatedBuilder(
                animation: _animationController,
                builder: (context, child) {
                  print(_animationController.value);
                  return CustomPaint(
                    painter: CustomCircle(
                      animationValue: _animationController.value,
                      progress: currentValue,
                      oldProgress: oldValue,
                      progressColor: Colors.blue,
                    ),
                  );
                },
              ),
              SizedBox(
                height: 100,
              ),
              MaterialButton(
                onPressed: () {
                  _animationController.reset();
                  setState(() {
                    oldValue = currentValue;
                    currentValue = random.nextInt(100).toDouble();
                  });
                  _animationController.forward();
                },
                child: Text('Animate'),
              )
            ],
          )),
        ),
      ),
    );
  }
}