feat: update profile home

lib/common/painter/wave_painter.dart

@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+import 'dart:math' as math;
+
+class WavePainter extends CustomPainter {
+  final double animation;
+  final Color color;
+
+  WavePainter({required this.animation, required this.color});
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    final paint = Paint()
+      ..color = color
+      ..strokeWidth = 1.5
+      ..style = PaintingStyle.stroke;
+
+    final path = Path();
+
+    // Create simplified wave patterns (reduced from 3 to 2 waves)
+    for (int i = 0; i < 2; i++) {
+      path.reset();
+      final double waveHeight = 15 + (i * 8);
+      final double frequency = 0.015 + (i * 0.008);
+      final double phase = animation + (i * math.pi / 2);
+
+      path.moveTo(0, size.height * 0.4 + (i * 40));
+
+      for (double x = 0; x <= size.width; x += 8) {
+        final y =
+            size.height * 0.4 +
+            (i * 40) +
+            math.sin((x * frequency) + phase) * waveHeight;
+        path.lineTo(x, y);
+      }
+
+      canvas.drawPath(path, paint..color = color.withOpacity(0.2 - (i * 0.05)));
+    }
+  }
+
+  @override
+  bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
+}

lib/presentation/pages/profile/widgets/header.dart

@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
+import 'dart:math' as math;
 
+import '../../../../common/painter/wave_painter.dart';
 import '../../../../common/theme/theme.dart';
 import '../../../components/spacer/spacer.dart';
 
@@ -11,20 +13,45 @@ class ProfileHeader extends StatefulWidget {
 }
 
 class _ProfileHeaderState extends State<ProfileHeader>
-    with SingleTickerProviderStateMixin {
+    with TickerProviderStateMixin {
   late AnimationController _animationController;
+  late AnimationController _particleController;
+  late AnimationController _waveController;
+  late AnimationController _breathController;
+
   late Animation<double> _fadeInAnimation;
   late Animation<Offset> _slideAnimation;
   late Animation<double> _scaleAnimation;
+  late Animation<double> _particleAnimation;
+  late Animation<double> _waveAnimation;
+  late Animation<double> _breathAnimation;
 
   @override
   void initState() {
     super.initState();
+
+    // Main content animations
     _animationController = AnimationController(
       duration: const Duration(milliseconds: 1200),
       vsync: this,
     );
 
+    _particleController = AnimationController(
+      duration: const Duration(seconds: 8),
+      vsync: this,
+    )..repeat();
+
+    _waveController = AnimationController(
+      duration: const Duration(seconds: 6),
+      vsync: this,
+    )..repeat();
+
+    _breathController = AnimationController(
+      duration: const Duration(seconds: 4),
+      vsync: this,
+    )..repeat(reverse: true);
+
+    // Content animations
     _fadeInAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
       CurvedAnimation(
         parent: _animationController,
@@ -47,17 +74,41 @@ class _ProfileHeaderState extends State<ProfileHeader>
       ),
     );
 
+    _particleAnimation = Tween<double>(
+      begin: 0.0,
+      end: 2 * math.pi,
+    ).animate(_particleController);
+
+    _waveAnimation = Tween<double>(
+      begin: 0.0,
+      end: 2 * math.pi,
+    ).animate(_waveController);
+
+    _breathAnimation = Tween<double>(begin: 0.8, end: 1.2).animate(
+      CurvedAnimation(parent: _breathController, curve: Curves.easeInOut),
+    );
+
     _animationController.forward();
   }
 
   @override
   void dispose() {
     _animationController.dispose();
+    _particleController.dispose();
+    _waveController.dispose();
+    _breathController.dispose();
     super.dispose();
   }
 
   @override
   Widget build(BuildContext context) {
+    return AnimatedBuilder(
+      animation: Listenable.merge([
+        _particleController,
+        _waveController,
+        _breathController,
+      ]),
+      builder: (context, child) {
         return Container(
           width: double.infinity,
           decoration: BoxDecoration(
@@ -80,39 +131,107 @@ class _ProfileHeaderState extends State<ProfileHeader>
           child: Stack(
             alignment: Alignment.center,
             children: [
-          // Background decoration with floating circles
+              // Simplified animated background
-          ...List.generate(
+              _buildAnimatedBackground(),
-            6,
+
-            (index) => Positioned(
+              // Main content
-              top: (index * 30.0) + 20,
+              _buildMainContent(),
-              right: (index * 40.0) - 50,
+            ],
-              child: AnimatedBuilder(
-                animation: _animationController,
-                builder: (context, child) {
-                  return Transform.rotate(
-                    angle: _animationController.value * 2 * 3.14159 * 0.5,
-                    child: Container(
-                      width: 20 + (index * 5.0),
-                      height: 20 + (index * 5.0),
-                      decoration: BoxDecoration(
-                        shape: BoxShape.circle,
-                        color: AppColor.textWhite.withOpacity(0.1),
-                      ),
           ),
         );
       },
+    );
+  }
+
+  Widget _buildAnimatedBackground() {
+    return Stack(
+      children: [
+        // Floating particles with orbital motion
+        ...List.generate(12, (index) {
+          final double radius = 80 + (index * 20);
+          final double angle = _particleAnimation.value + (index * 0.5);
+          final double centerX = MediaQuery.of(context).size.width * 0.5;
+          final double centerY = 150;
+
+          return Positioned(
+            left: centerX + math.cos(angle) * radius - 6,
+            top: centerY + math.sin(angle) * (radius * 0.6) - 6,
+            child: Transform.scale(
+              scale: _breathAnimation.value * 0.5,
+              child: Container(
+                width: 3 + (index % 4),
+                height: 3 + (index % 4),
+                decoration: BoxDecoration(
+                  shape: BoxShape.circle,
+                  color: AppColor.textWhite.withOpacity(0.6),
+                  boxShadow: [
+                    BoxShadow(
+                      color: AppColor.textWhite.withOpacity(0.3),
+                      blurRadius: 8,
+                      spreadRadius: 1,
+                    ),
+                  ],
+                ),
+              ),
+            ),
+          );
+        }),
+
+        // Wave patterns
+        Positioned.fill(
+          child: CustomPaint(
+            painter: WavePainter(
+              animation: _waveAnimation.value,
+              color: AppColor.textWhite.withOpacity(0.1),
             ),
           ),
         ),
 
-          // Main content
+        // Sparkle effects
-          Column(
+        ...List.generate(6, (index) {
+          return Positioned(
+            left: (index * 80.0) % MediaQuery.of(context).size.width,
+            top: 50 + (index * 30.0),
+            child: Transform.rotate(
+              angle: _particleAnimation.value * 2 + index,
+              child: Transform.scale(
+                scale: math.sin(_particleAnimation.value + index) * 0.5 + 1,
+                child: Icon(
+                  Icons.auto_awesome,
+                  size: 12 + (index % 3) * 4,
+                  color: AppColor.textWhite.withOpacity(0.4),
+                ),
+              ),
+            ),
+          );
+        }),
+
+        // Gradient overlay for depth
+        Container(
+          decoration: BoxDecoration(
+            gradient: RadialGradient(
+              center: const Alignment(0, -0.3),
+              radius: 1.2,
+              colors: [
+                Colors.transparent,
+                AppColor.primaryGradient.first.withOpacity(0.1),
+                Colors.transparent,
+              ],
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildMainContent() {
+    return Column(
       crossAxisAlignment: CrossAxisAlignment.center,
       mainAxisAlignment: MainAxisAlignment.center,
       children: [
         const SpaceHeight(30),
 
-              // Profile Picture with enhanced design
+        // Profile Picture with simplified design
         AnimatedBuilder(
           animation: _scaleAnimation,
           builder: (context, child) {
@@ -121,8 +240,13 @@ class _ProfileHeaderState extends State<ProfileHeader>
               child: Stack(
                 alignment: Alignment.center,
                 children: [
-                        // Outer glow effect
+                  // Outer glow effect with breathing animation
-                        Container(
+                  AnimatedBuilder(
+                    animation: _breathAnimation,
+                    builder: (context, child) {
+                      return Transform.scale(
+                        scale: _breathAnimation.value * 0.1 + 1,
+                        child: Container(
                           width: 120,
                           height: 120,
                           decoration: BoxDecoration(
@@ -136,16 +260,16 @@ class _ProfileHeaderState extends State<ProfileHeader>
                             ],
                           ),
                         ),
+                      );
+                    },
+                  ),
                   // Profile picture container
                   Container(
                     width: 110,
                     height: 110,
                     decoration: BoxDecoration(
                       shape: BoxShape.circle,
-                            border: Border.all(
+                      border: Border.all(color: AppColor.textWhite, width: 4),
-                              color: AppColor.textWhite,
-                              width: 4,
-                            ),
                       gradient: LinearGradient(
                         colors: [
                           AppColor.primaryLight,
@@ -175,10 +299,15 @@ class _ProfileHeaderState extends State<ProfileHeader>
                       ),
                     ),
                   ),
-                        // Online status indicator
+                  // Online status indicator with subtle pulse
                   Positioned(
                     bottom: 5,
                     right: 5,
+                    child: AnimatedBuilder(
+                      animation: _breathController,
+                      builder: (context, child) {
+                        return Transform.scale(
+                          scale: _breathAnimation.value * 0.2 + 1,
                           child: Container(
                             width: 24,
                             height: 24,
@@ -189,7 +318,17 @@ class _ProfileHeaderState extends State<ProfileHeader>
                                 color: AppColor.textWhite,
                                 width: 3,
                               ),
+                              boxShadow: [
+                                BoxShadow(
+                                  color: Colors.green.withOpacity(0.6),
+                                  blurRadius: 8,
+                                  spreadRadius: 2,
                                 ),
+                              ],
+                            ),
+                          ),
+                        );
+                      },
                     ),
                   ),
                 ],
@@ -243,10 +382,7 @@ class _ProfileHeaderState extends State<ProfileHeader>
           child: SlideTransition(
             position: _slideAnimation,
             child: Container(
-                    padding: const EdgeInsets.symmetric(
+              padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-                      horizontal: 20,
-                      vertical: 10,
-                    ),
               decoration: BoxDecoration(
                 color: AppColor.textWhite.withOpacity(0.25),
                 borderRadius: BorderRadius.circular(25),
@@ -287,9 +423,6 @@ class _ProfileHeaderState extends State<ProfileHeader>
 
         const SpaceHeight(30),
       ],
-          ),
-        ],
-      ),
     );
   }
 }