fast_animation 1.0.0

Supercharge your Flutter animations! Zero-overhead optimization with auto RepaintBoundary, smart frame skipping, and instant performance gains. Drop-in replacement for standard animation widgets.

example/main.dart

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

/// Fast Animation ライブラリのデモアプリ
void main() {
  // グローバル設定（オプション）
  FastAnimationConfig.instance.configure(
    animationsEnabled: true,
    autoRepaintBoundary: true,
    defaultDurationMs: 300,
  );

  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Fast Animation Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const DemoPage(),
    );
  }
}

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

  @override
  State<DemoPage> createState() => _DemoPageState();
}

class _DemoPageState extends State<DemoPage>
    with TickerProviderStateMixin, FastAnimationMixin {
  late final OptimizedAnimationController _fadeController;
  late final OptimizedAnimationController _scaleController;
  late final OptimizedAnimationController _slideController;
  late final OptimizedAnimationController _rotationController;

  bool _showImplicit = false;
  int _switcherIndex = 0;

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

    _fadeController = createController(
      duration: const Duration(milliseconds: 500),
    );
    _scaleController = createController(
      duration: const Duration(milliseconds: 500),
    );
    _slideController = createController(
      duration: const Duration(milliseconds: 500),
    );
    _rotationController = createController(
      duration: const Duration(milliseconds: 1000),
    );
  }

  @override
  void dispose() {
    _fadeController.dispose();
    _scaleController.dispose();
    _slideController.dispose();
    _rotationController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Fast Animation Demo'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 明示的アニメーションセクション
            const Text(
              '明示的アニメーション',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),

            // フェードトランジション
            _buildAnimationCard(
              title: 'FastFadeTransition',
              controller: _fadeController,
              child: FastFadeTransition(
                opacity: _fadeController,
                child: _buildSampleBox(Colors.blue),
              ),
            ),

            // スケールトランジション
            _buildAnimationCard(
              title: 'FastScaleTransition',
              controller: _scaleController,
              child: FastScaleTransition(
                scale: _scaleController,
                child: _buildSampleBox(Colors.green),
              ),
            ),

            // スライドトランジション
            _buildAnimationCard(
              title: 'FastSlideTransition',
              controller: _slideController,
              child: FastSlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(-1, 0),
                  end: Offset.zero,
                ).animate(_slideController),
                child: _buildSampleBox(Colors.orange),
              ),
            ),

            // 回転トランジション
            _buildAnimationCard(
              title: 'FastRotationTransition',
              controller: _rotationController,
              child: FastRotationTransition(
                turns: _rotationController,
                child: _buildSampleBox(Colors.purple),
              ),
            ),

            const SizedBox(height: 32),

            // 暗黙的アニメーションセクション
            const Text(
              '暗黙的アニメーション',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),

            ElevatedButton(
              onPressed: () => setState(() => _showImplicit = !_showImplicit),
              child: const Text('Toggle'),
            ),
            const SizedBox(height: 16),

            // FastAnimatedOpacity
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text('FastAnimatedOpacity'),
                    const SizedBox(height: 8),
                    FastAnimatedOpacity(
                      opacity: _showImplicit ? 1.0 : 0.3,
                      duration: const Duration(milliseconds: 500),
                      child: _buildSampleBox(Colors.teal),
                    ),
                  ],
                ),
              ),
            ),

            // FastAnimatedContainer
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text('FastAnimatedContainer'),
                    const SizedBox(height: 8),
                    FastAnimatedContainer(
                      duration: const Duration(milliseconds: 500),
                      curve: FastCurves.fastEaseInOut,
                      width: _showImplicit ? 150 : 80,
                      height: _showImplicit ? 150 : 80,
                      decoration: BoxDecoration(
                        color: _showImplicit ? Colors.red : Colors.blue,
                        borderRadius: BorderRadius.circular(
                          _showImplicit ? 75 : 8,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),

            // FastAnimatedSwitcher
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text('FastAnimatedSwitcher'),
                    const SizedBox(height: 8),
                    Row(
                      children: [
                        ElevatedButton(
                          onPressed: () => setState(() => _switcherIndex++),
                          child: const Text('Switch'),
                        ),
                        const SizedBox(width: 16),
                        FastAnimatedSwitcher(
                          duration: const Duration(milliseconds: 300),
                          transitionBuilder:
                              FastAnimatedSwitcher.fastScaleTransition,
                          child: Container(
                            key: ValueKey(_switcherIndex),
                            width: 80,
                            height: 80,
                            decoration: BoxDecoration(
                              color:
                                  Colors.primaries[_switcherIndex %
                                      Colors.primaries.length],
                              borderRadius: BorderRadius.circular(8),
                            ),
                            child: Center(
                              child: Text(
                                '$_switcherIndex',
                                style: const TextStyle(
                                  color: Colors.white,
                                  fontSize: 24,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),

            const SizedBox(height: 32),

            // スタガードアニメーション
            const Text(
              'スタガードアニメーション',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),

            ...List.generate(5, (index) {
              return FastStaggeredAnimation(
                index: index,
                totalItems: 5,
                baseDuration: const Duration(milliseconds: 300),
                staggerDelay: const Duration(milliseconds: 100),
                child: Card(
                  child: ListTile(
                    leading: CircleAvatar(child: Text('${index + 1}')),
                    title: Text('Item ${index + 1}'),
                    subtitle: const Text('Staggered animation'),
                  ),
                ),
              );
            }),
          ],
        ),
      ),
    );
  }

  Widget _buildAnimationCard({
    required String title,
    required AnimationController controller,
    required Widget child,
  }) {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(title),
            const SizedBox(height: 8),
            Row(
              children: [
                IconButton(
                  icon: const Icon(Icons.play_arrow),
                  onPressed: () => controller.forward(from: 0),
                ),
                IconButton(
                  icon: const Icon(Icons.replay),
                  onPressed: () => controller.reverse(from: 1),
                ),
                IconButton(
                  icon: const Icon(Icons.repeat),
                  onPressed: () => controller.repeat(reverse: true),
                ),
                IconButton(
                  icon: const Icon(Icons.stop),
                  onPressed: () => controller.stop(),
                ),
                const SizedBox(width: 16),
                Expanded(child: Center(child: child)),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildSampleBox(Color color) {
    return Container(
      width: 80,
      height: 80,
      decoration: BoxDecoration(
        color: color,
        borderRadius: BorderRadius.circular(8),
      ),
    );
  }
}