📦 zeba_scroll_effects

✨ A powerful Flutter package that provides beautiful and reusable scroll-based UI effects.

Build modern, smooth, and engaging UIs effortlessly with ready-to-use scroll animations like parallax, collapsing app bars, fade/scale effects, sticky headers, and more.

🚀 Features

  • 🌄 Parallax Scrolling
  • 📉 Collapsing AppBar
  • ✨ Fade & Scale on Scroll
  • 📌 Sticky Headers
  • 🎬 Scroll Reveal Animations
  • ⚡ Lightweight & easy to integrate
  • 🎯 No external dependencies

📦 Installation

Add this to your pubspec.yaml:

dependencies:
  zeba_scroll_effects: ^0.0.1

Then run:

flutter pub get

🛠 Usage

🔹 Import

import 'package:zeba_scroll_effects/zeba_scroll_effects.dart';

🌄 Parallax Effect

ZebaParallax(
  controller: scrollController,
  child: Image.network('https://picsum.photos/500'),
)

📉 Collapsing AppBar

ZebaCollapsingAppBar(
  title: "Zeba Effects",
  background: Image.network(
    "https://picsum.photos/500",
    fit: BoxFit.cover,
  ),
)

✨ Fade & Scale Effect

ZebaFadeScale(
  controller: scrollController,
  child: Text("Scroll Me"),
)

📌 Sticky Header

ZebaStickyHeader(
  header: Container(
    color: Colors.white,
    child: Text("Header"),
  ),
  child: Container(),
)

🎬 Scroll Reveal Animation

ZebaScrollReveal(
  child: Text("Animated Item"),
)

📱 Example

class DemoPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final controller = ScrollController();

    return Scaffold(
      body: CustomScrollView(
        controller: controller,
        slivers: [
          ZebaCollapsingAppBar(
            title: "Zeba Effects",
            background: Image.network(
              "https://picsum.photos/500",
              fit: BoxFit.cover,
            ),
          ),
          SliverList(
            delegate: SliverChildBuilderDelegate(
              (context, index) {
                return ZebaFadeScale(
                  controller: controller,
                  child: ListTile(
                    title: Text("Item $index"),
                  ),
                );
              },
              childCount: 20,
            ),
          ),
        ],
      ),
    );
  }
}

⚡ Performance Notes

  • Designed for smooth scrolling performance
  • Uses efficient AnimatedBuilder and Flutter rendering
  • Works well with large lists (optimize further with RepaintBoundary if needed)

🧪 Testing

Run tests using:

flutter test

🤝 Contributing

Contributions are welcome! Feel free to open issues or submit pull requests to improve this package.

📄 License

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

You are free to:

  • Use
  • Modify
  • Distribute

Under the condition that:

  • You disclose source code
  • Use the same license
  • State changes made

Full license text: https://www.gnu.org/licenses/gpl-3.0.en.html

👨‍💻 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, tech, and development at zeba.academy and code.zeba.academy.

Empower yourself with practical skills through curated tutorials, real-world projects, and hands-on experience. Level up your tech game today! 💻✨

Zeba Academy is a learning platform dedicated to coding, technology, and development.

➡ Visit our main site: https://zeba.academy ➡ Explore courses: https://code.zeba.academy ➡ YouTube: https://www.youtube.com/@zeba.academy ➡ Instagram: https://www.instagram.com/zeba.academy/

🙌 Thank You

Thank you for using zeba_scroll_effects! If you like this package, consider giving it a ⭐ on GitHub.

Libraries

zeba_scroll_effects