apskel-owner-flutter/lib/presentation/components/appbar/appbar.dart

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

import '../../../../common/theme/theme.dart';
import '../../../common/painter/wave_painter.dart';

class CustomAppBar extends StatefulWidget {
  final String title;
  final bool isBack;
  const CustomAppBar({super.key, required this.title, this.isBack = true});

  @override
  State<CustomAppBar> createState() => _CustomAppBarState();
}

class _CustomAppBarState extends State<CustomAppBar>
    with TickerProviderStateMixin {
  late AnimationController _particleController;
  late AnimationController _waveController;
  late AnimationController _breathController;

  late Animation<double> _particleAnimation;
  late Animation<double> _waveAnimation;
  late Animation<double> _breathAnimation;

  @override
  void initState() {
    super.initState();

    _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);

    _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),
    );
  }

  @override
  void dispose() {
    _particleController.dispose();
    _waveController.dispose();
    _breathController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return FlexibleSpaceBar(
      titlePadding: EdgeInsets.only(left: widget.isBack ? 50 : 20, bottom: 16),
      title: Text(
        widget.title,
        style: AppStyle.xl.copyWith(
          color: AppColor.textWhite,
          fontSize: 18,
          fontWeight: FontWeight.w600,
        ),
      ),
      background: Container(
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            colors: AppColor.primaryGradient,
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
          ),
        ),
        child: AnimatedBuilder(
          animation: Listenable.merge([
            _particleController,
            _waveController,
            _breathController,
          ]),
          builder: (context, child) {
            return Stack(
              children: [
                // Animated background elements
                _buildAnimatedBackground(context),
              ],
            );
          },
        ),
      ),
    );
  }

  Widget _buildAnimatedBackground(BuildContext context) {
    final size = MediaQuery.of(context).size;

    return Stack(
      children: [
        // Floating particles with orbital motion
        ...List.generate(8, (index) {
          final double radius = 40 + (index * 15);
          final double angle = _particleAnimation.value + (index * 0.8);
          final double centerX = size.width * 0.7;
          final double centerY = 60;

          return Positioned(
            left: centerX + math.cos(angle) * radius - 3,
            top: centerY + math.sin(angle) * (radius * 0.5) - 3,
            child: Transform.scale(
              scale: _breathAnimation.value * 0.5,
              child: Container(
                width: 4 + (index % 3),
                height: 4 + (index % 3),
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  color: AppColor.textWhite.withOpacity(0.6),
                  boxShadow: [
                    BoxShadow(
                      color: AppColor.textWhite.withOpacity(0.3),
                      blurRadius: 6,
                      spreadRadius: 1,
                    ),
                  ],
                ),
              ),
            ),
          );
        }),

        // Wave patterns
        Positioned.fill(
          child: CustomPaint(
            painter: WavePainter(
              animation: _waveAnimation.value,
              color: AppColor.textWhite.withOpacity(0.1),
            ),
          ),
        ),

        // Sparkle effects
        ...List.generate(4, (index) {
          return Positioned(
            left: (index * 90.0) % size.width,
            top: 20 + (index * 25.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: 10 + (index % 3) * 3,
                  color: AppColor.textWhite.withOpacity(0.4),
                ),
              ),
            ),
          );
        }),

        // Gradient overlay for depth
        Container(
          decoration: BoxDecoration(
            gradient: RadialGradient(
              center: const Alignment(0.3, -0.2),
              radius: 1.2,
              colors: [
                Colors.transparent,
                AppColor.primaryGradient.first.withOpacity(0.1),
                Colors.transparent,
              ],
            ),
          ),
        ),
      ],
    );
  }
}