celebration_fx 1.0.1

celebration_fx: ^1.0.1 copied to clipboard

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Celebration FX Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFF6366F1)),
        useMaterial3: true,
      ),
      home: const CelebrationDemoPage(),
    );
  }
}

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

  @override
  State<CelebrationDemoPage> createState() => _CelebrationDemoPageState();
}

class _CelebrationDemoPageState extends State<CelebrationDemoPage> {
  final CelebrationController _controller = CelebrationController();

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _triggerBurst(CelebrationConfig config) {
    final size = MediaQuery.of(context).size;
    final center = Offset(size.width / 2, size.height * 0.45);
    _controller.burst(origin: center, config: config);
  }

  @override
  Widget build(BuildContext context) {
    return CelebrationFx(
      controller: _controller,
      child: Scaffold(
        backgroundColor: const Color(0xFF0F172A),
        appBar: AppBar(
          title: const Text(
            '🎉 celebration_fx Demo',
            style: TextStyle(fontWeight: FontWeight.bold, color: Colors.white),
          ),
          backgroundColor: const Color(0xFF1E293B),
          elevation: 0,
          centerTitle: true,
        ),
        body: SafeArea(
          child: Padding(
            padding: const EdgeInsets.all(20.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                const Spacer(),
                const Center(
                  child: Text(
                    'Tap Any Effect Below to Celebrate! 🚀',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontSize: 20,
                      fontWeight: FontWeight.w600,
                      color: Colors.white,
                    ),
                  ),
                ),
                const SizedBox(height: 8),
                const Center(
                  child: Text(
                    'Physics-driven particle simulation with 3D paper flutter',
                    style: TextStyle(fontSize: 13, color: Colors.white60),
                  ),
                ),
                const Spacer(),

                // Buttons Grid
                Wrap(
                  spacing: 12,
                  runSpacing: 12,
                  alignment: WrapAlignment.center,
                  children: [
                    _buildEffectButton(
                      label: '🎊 Confetti Cannon',
                      color: const Color(0xFFEF4444),
                      onTap: () => _triggerBurst(CelebrationConfig.confetti()),
                    ),
                    _buildEffectButton(
                      label: '🎆 Fireworks Burst',
                      color: const Color(0xFF06B6D4),
                      onTap: () => _triggerBurst(CelebrationConfig.fireworks()),
                    ),
                    _buildEffectButton(
                      label: '🪙 Coin Explosion',
                      color: const Color(0xFFF59E0B),
                      onTap: () => _triggerBurst(CelebrationConfig.coins()),
                    ),
                    _buildEffectButton(
                      label: '💖 Heart Fountain',
                      color: const Color(0xFFEC4899),
                      onTap: () => _triggerBurst(CelebrationConfig.hearts()),
                    ),
                    _buildEffectButton(
                      label: '⭐ Star Burst',
                      color: const Color(0xFF8B5CF6),
                      onTap: () => _triggerBurst(CelebrationConfig.stars()),
                    ),
                  ],
                ),
                const SizedBox(height: 24),

                // Self-contained CelebrationButton
                Center(
                  child: CelebrationButton(
                    config: CelebrationConfig.coins(),
                    style: ElevatedButton.styleFrom(
                      backgroundColor: const Color(0xFF10B981),
                      foregroundColor: Colors.white,
                      padding: const EdgeInsets.symmetric(
                        horizontal: 28,
                        vertical: 16,
                      ),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(16),
                      ),
                    ),
                    onPressed: () {},
                    child: const Row(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        Icon(Icons.monetization_on, size: 20),
                        SizedBox(width: 8),
                        Text(
                          'Claim 500 Coins!',
                          style: TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                const SizedBox(height: 20),
              ],
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildEffectButton({
    required String label,
    required Color color,
    required VoidCallback onTap,
  }) {
    return ElevatedButton(
      onPressed: onTap,
      style: ElevatedButton.styleFrom(
        backgroundColor: color.withValues(alpha: 0.2),
        foregroundColor: color,
        side: BorderSide(color: color.withValues(alpha: 0.6)),
        padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(14),
        ),
      ),
      child: Text(
        label,
        style: const TextStyle(fontWeight: FontWeight.bold),
      ),
    );
  }
}