Shaker #

A Flutter package that provides an easy-to-use widget for adding shake animations to any Flutter widget. Built on top of the powerful flutter_animate package, Shaker offers a simple API with extensive customization options.

Demo #

Features #

✨ Easy Integration - Wrap any widget with Shaker to add shake animations

🎨 Highly Customizable - Control duration, frequency, rotation, offset, and animation curves

⚡ Performance Optimized - Built on flutter_animate for smooth, efficient animations

🎯 Callback Support - Execute actions when animations complete

📱 Platform Independent - Works seamlessly across all Flutter platforms

Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  shaker: ^1.0.2

Then run:

flutter pub get

Usage #

Basic Example #

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

class MyWidget extends StatefulWidget {
  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  bool _isShaking = false;

   void _triggerShake({bool autoReset = true}) {
    setState(() {
      _isShaking = true;
    });

    // Reset shake state after animation completes
    if (autoReset) {
      Future.delayed(const Duration(milliseconds: 1500), () {
        if (mounted) {
          setState(() {
            _isShaking = false;
          });
        }
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Shaker(
          isShaking: _isShaking,
          child: Icon(Icons.favorite, size: 100, color: Colors.red),
        ),
        ElevatedButton(
          onPressed: _triggerShake,
          child: Text('Shake It!'),
        ),
      ],
    );
  }
}

Advanced Example with Custom Parameters #

Shaker(
  isShaking: _isShaking,
  duration: const Duration(milliseconds: 800),
  hz: 6, // Shake frequency
  rotation: -0.05, // Rotation angle
  offset: const Offset(0.3, 0.3), // Shake direction and intensity
  curve: Curves.bounceInOut, // Animation curve
  onComplete: () {
    print('Shake animation completed!');
    setState(() {
        _isShaking = false;
      });
  },
  child: Container(
    width: 100,
    height: 100,
    color: Colors.blue,
    child: Center(child: Text('Shake Me!')),
  ),
)

API Reference #

Shaker Widget Parameters #

Example App #

Check out the example directory for a complete sample application demonstrating various use cases:

• Basic shake animation
• Custom shake parameters
• Different widget types (Icons, Containers, etc.)
• Animation callbacks

To run the example:

cd example
flutter run

Testing #

The package includes comprehensive tests. Run them with:

flutter test

Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

License #

This project is licensed under the MIT License - see the LICENSE file for details.

Repository #

https://github.com/SoundSliced/shaker

Issues and Feedback #

Please file issues, bugs, or feature requests in our issue tracker.

Credits #

Built with ❤️ using flutter_animate