zeba_academy_flip

pub package License: GPL v3 Flutter Platform

A powerful, customizable, and lightweight Flutter package for creating beautiful flip animations. Easily build interactive flip cards, animated widgets, flashcards, business cards, profile cards, game cards, and more with smooth horizontal and vertical flip effects.

✨ Features

  • 🎴 Beautiful flip widget
  • 🔄 Card flip animation
  • 🎮 Flip controller for programmatic flipping
  • ⏱️ Auto flip support
  • ↔️ Horizontal flip direction
  • ↕️ Vertical flip direction
  • 👆 Tap to flip
  • ⚡ Smooth animations
  • 🎨 Fully customizable front and back widgets
  • 📱 Works on Android, iOS, Web, Windows, macOS, and Linux
  • 🚀 Lightweight and easy to integrate
  • ❤️ Null-safe
  • 📦 Production ready

Installation

Add the dependency to your pubspec.yaml.

dependencies:
  zeba_academy_flip: ^1.0.0

Then install packages:

flutter pub get

Import

import 'package:zeba_academy_flip/zeba_academy_flip.dart';

Quick Start

FlipWidget(
  front: Container(
    color: Colors.blue,
    child: const Center(
      child: Text("Front"),
    ),
  ),
  back: Container(
    color: Colors.red,
    child: const Center(
      child: Text("Back"),
    ),
  ),
)

Card Flip Example

CardFlip(
  front: const Text("Question"),
  back: const Text("Answer"),
)

Using FlipController

final controller = FlipController();

FlipWidget(
  controller: controller,
  front: const Text("Front"),
  back: const Text("Back"),
);

Trigger the animation:

controller.flip();

Auto Flip

FlipWidget(
  autoFlip: true,
  autoFlipDuration: Duration(seconds: 2),
  front: const Text("Front"),
  back: const Text("Back"),
)

Flip Direction

Horizontal flip

FlipWidget(
  direction: FlipDirection.horizontal,
  front: ...,
  back: ...,
)

Vertical flip

FlipWidget(
  direction: FlipDirection.vertical,
  front: ...,
  back: ...,
)

Constructor

FlipWidget({
  required Widget front,
  required Widget back,
  FlipController? controller,
  FlipDirection direction = FlipDirection.horizontal,
  Duration duration = const Duration(milliseconds: 600),
  bool autoFlip = false,
  Duration autoFlipDuration = const Duration(seconds: 3),
})

API Reference

FlipWidget

Property Description
front Front widget
back Back widget
controller Flip programmatically
direction Horizontal or Vertical
duration Animation duration
autoFlip Enables automatic flipping
autoFlipDuration Auto flip interval

FlipController

Method Description
flip() Starts flip animation

FlipDirection

FlipDirection.horizontal
FlipDirection.vertical

Use Cases

  • Flash cards
  • Quiz applications
  • Business cards
  • Profile cards
  • Product cards
  • Educational apps
  • Memory games
  • Greeting cards
  • Dashboard widgets
  • Interactive UI
  • Learning applications

Platform Support

Platform Supported
Android ✅
iOS ✅
Web ✅
Windows ✅
macOS ✅
Linux ✅

Why zeba_academy_flip?

  • Clean API
  • Highly customizable
  • Lightweight
  • Fast rendering
  • Easy integration
  • Null-safe
  • Cross-platform
  • Production ready
  • Open source
  • Beginner friendly

Example Project

The package includes a complete example demonstrating:

  • Basic flip widget
  • Card flip
  • Controller usage
  • Auto flip
  • Horizontal animation
  • Vertical animation

Run the example:

cd example
flutter run

Contributing

Contributions are welcome.

If you discover a bug or have an idea for an improvement, feel free to open an issue or submit a pull request.

Please ensure that new features include appropriate documentation and tests.

Roadmap

  • More flip animations
  • 3D depth effects
  • Gesture-based flipping
  • Multiple animation curves
  • Custom perspective control
  • Flip callbacks
  • Multiple card stacks
  • Hero animation support
  • Performance improvements

License

This project is licensed under the GNU General Public License v3.0 (GPL-3.0).

You are free to use, modify, and distribute this software under the terms of the GPL v3 license.

See the LICENSE file for the complete license text.

About Me

✨ I'm Sufyan bin Uzayr, an open-source developer passionate about building and sharing meaningful projects.

You can learn more about me and my work at https://sufyanism.com/ or connect with me on LinkedIn:

https://www.linkedin.com/in/sufyanism

Your all-in-one learning hub!

🚀 Explore courses and resources in coding, technology, and software development with Zeba Academy.

Whether you're a beginner or an experienced developer, you'll find practical tutorials, real-world projects, and hands-on learning experiences designed to help you grow your skills.

Explore

🌐 Main Website https://zeba.academy

💻 Coding Portal https://code.zeba.academy

📺 YouTube Channel https://www.youtube.com/@zeba.academy

📷 Instagram https://www.instagram.com/zeba.academy/

Support

If you find this package useful, consider:

  • ⭐ Starring the repository
  • 👍 Liking and sharing the project
  • 🐞 Reporting bugs
  • 💡 Suggesting new features
  • 🤝 Contributing to development

Your support helps improve the package for the Flutter community.

Made with ❤️ for the Flutter Community by Zeba Academy.

Libraries

zeba_academy_flip