swipe_card_animation 1.0.1

A Flutter package for swipe card animations.

Swipe Cards Package

The Swipe Cards package provides customizable card animations for Flutter applications. It includes two types of animations: Shuffle Card Animation and Stack Card Animation. This package allows developers to easily integrate card swiping functionality into their apps with minimal setup.

Features

• Shuffle Card Animation: Allows cards to be swiped in both directions (left and right).
• Stack Card Animation: Allows cards to be swiped forward only (left swipe does nothing).
• Customizable Card Styles: Define card height, width, colors, and border radius to suit your app's design.
• Easy Integration: Simple API to use the animations in your Flutter app.

Installation

To install the Swipe Cards package, add the following dependency to your pubspec.yaml file:

dependencies:
  swipe_card_animation: ^1.0.0

Usage

Import the Package

import 'package:swipe_card_animation/swipe_card_animation.dart';

Example of Shuffle Card Animation

ShuffleCardAnimation(
  cardStyle: CardStyle(
    height: 300,
    width: 200,
    activeColor: Colors.blue,
    inactiveColor: Colors.grey,
    borderRadius: 15,
  ),
  totalCards: 10,
  builder: (context, index) {
    return Container(
      alignment: Alignment.center,
      child: Text('Card $index'),
    );
  },
);

Example of Stack Card Animation

StackCardAnimation(
  cardStyle: CardStyle(
    height: 300,
    width: 200,
    activeColor: Colors.green,
    inactiveColor: Colors.grey,
    borderRadius: 15,
  ),
  totalCards: 10,
  builder: (context, index) {
    return Container(
      alignment: Alignment.center,
      child: Text('Card $index'),
    );
  },
);

Central Card Animation

The CardAnimation class provides a unified interface for both Shuffle and Stack animations. You can specify the type of animation and its direction.

Example

CardAnimation(
  animationType: AnimationType.shuffle, // or AnimationType.stack
  cardStyle: CardStyle(
    height: 300,
    width: 200,
    activeColor: Colors.red,
    inactiveColor: Colors.grey,
    borderRadius: 15,
  ),
  totalCards: 10,
  builder: (context, index) {
    return Container(
      alignment: Alignment.center,
      child: Text('Card $index'),
    );
  },
);

Running Examples

The examples for both ShuffleCardAnimation and StackCardAnimation are located in the example/ folder. To run these examples:

1. Navigate to the example/ directory:

   cd example
   

2. Install the dependencies:

   flutter pub get
   

3. Run any example app:

   flutter run example1
   flutter run example2
   flutter run example3
   flutter run example4
   flutter run example5
   

This will launch a Flutter app that demonstrates the card animations.

Adding Video Content

Here are some example GIFs demonstrating the card animations in action:

Shuffle animation showing cards swiping left and right.

Stack animation showing only forward card swipes.

Example of customizing card colors and size.

Demonstrates the scaling of cards as they are swiped.

The central card animation that integrates both Shuffle and Stack types.

Contributing

Contributions are welcome! Please open an issue or submit a pull request for any enhancements or bug fixes.

License

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