12/22/2

lib/views/widgets/mycircular.dart

@@ -1,36 +1,131 @@
 import 'package:flutter/material.dart';
 
-class MyCircularProgressIndicator extends StatelessWidget {
+class MyCircularProgressIndicator extends StatefulWidget {
   final Color backgroundColor;
+  final double size;
+  final Color progressColor;
+  final double strokeWidth;
 
   const MyCircularProgressIndicator({
     super.key,
     this.backgroundColor = Colors.transparent,
+    this.size = 110,
+    this.progressColor = Colors.blue,
+    this.strokeWidth = 3.0,
   });
 
+  @override
+  State<MyCircularProgressIndicator> createState() =>
+      _MyCircularProgressIndicatorState();
+}
+
+class _MyCircularProgressIndicatorState
+    extends State<MyCircularProgressIndicator>
+    with SingleTickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<double> _scaleAnimation;
+  late Animation<double> _rotationAnimation;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(
+      duration: const Duration(seconds: 2),
+      vsync: this,
+    )..repeat(reverse: true);
+
+    _scaleAnimation = Tween<double>(
+      begin: 0.95,
+      end: 1.05,
+    ).animate(CurvedAnimation(
+      parent: _controller,
+      curve: Curves.easeInOut,
+    ));
+
+    _rotationAnimation = Tween<double>(
+      begin: 0,
+      end: 2,
+    ).animate(CurvedAnimation(
+      parent: _controller,
+      curve: Curves.linear,
+    ));
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     return Center(
-      child: Container(
-        width: 110,
-        height: 110,
-        decoration: BoxDecoration(
-          color: backgroundColor,
-          shape: BoxShape.circle,
-        ),
-        child: Stack(
-          children: [
-            const Center(child: CircularProgressIndicator()),
-            Column(
-              children: [
-                Align(
-                  alignment: Alignment.center,
-                  child: Image.asset('assets/images/logo.gif'),
-                ),
-              ],
+      child: AnimatedBuilder(
+        animation: _controller,
+        builder: (context, child) {
+          return Transform.scale(
+            scale: _scaleAnimation.value,
+            child: Container(
+              width: widget.size,
+              height: widget.size,
+              decoration: BoxDecoration(
+                color: widget.backgroundColor,
+                shape: BoxShape.circle,
+                boxShadow: [
+                  BoxShadow(
+                    color: widget.progressColor.withAlpha(30),
+                    blurRadius: 12,
+                    spreadRadius: 2,
+                  ),
+                ],
+              ),
+              child: Stack(
+                alignment: Alignment.center,
+                children: [
+                  // Outer rotating progress indicator
+                  Transform.rotate(
+                    angle: _rotationAnimation.value * 3.14,
+                    child: CircularProgressIndicator(
+                      strokeWidth: widget.strokeWidth,
+                      valueColor: AlwaysStoppedAnimation<Color>(
+                        widget.progressColor,
+                      ),
+                    ),
+                  ),
+                  // Inner static progress indicator
+                  CircularProgressIndicator(
+                    strokeWidth: widget.strokeWidth * 0.7,
+                    valueColor: AlwaysStoppedAnimation<Color>(
+                      widget.progressColor.withAlpha(150),
+                    ),
+                  ),
+                  // Logo container with scale animation
+                  ScaleTransition(
+                    scale: Tween<double>(
+                      begin: 0.9,
+                      end: 1.0,
+                    ).animate(CurvedAnimation(
+                      parent: _controller,
+                      curve: Curves.easeInOut,
+                    )),
+                    child: Container(
+                      width: widget.size * 0.7,
+                      height: widget.size * 0.7,
+                      decoration: BoxDecoration(
+                        shape: BoxShape.circle,
+                        color: widget.backgroundColor,
+                      ),
+                      child: Image.asset(
+                        'assets/images/logo.gif',
+                        fit: BoxFit.contain,
+                      ),
+                    ),
+                  ),
+                ],
+              ),
             ),
-          ],
-        ),
+          );
+        },
       ),
     );
   }