zeba_academy_visibility 0.0.1

zeba_academy_visibility: ^0.0.1 copied to clipboard

📄 zeba_academy_visibility — README.md 📦 Package Name

zeba_academy_visibility

📌 Description

A lightweight Flutter package for detecting widget visibility inside scroll views with:

Visibility percentage tracking Fade & slide animations on visibility Once-only trigger support Smooth scroll-based detection ✨ Features

✔ Visibility detection inside scroll views ✔ Visibility percentage (0.0 → 1.0) ✔ Fade animation support ✔ Slide animation support ✔ Once-only visibility trigger ✔ Lightweight & performance friendly ✔ Easy integration in any Flutter app

🚀 Installation

Add dependency in pubspec.yaml:

dependencies: zeba_academy_visibility: ^0.0.1

Then run:

flutter pub get 🧠 Basic Usage 👁️ Visibility Detection import 'package:flutter/material.dart'; import 'package:zeba_academy_visibility/zeba_academy_visibility.dart';

class ExamplePage extends StatelessWidget { final controller = VisibilityController();

ExamplePage({super.key});

@override Widget build(BuildContext context) { return Scaffold( body: ListView( children: [ ZebaVisibilityDetector( controller: controller, visibilityThreshold: 0.5, onVisibilityChanged: (isVisible, fraction) { debugPrint("Visible: $isVisible | $fraction"); }, child: Container( height: 200, color: Colors.blue, child: const Center( child: Text( "Hello Visibility", style: TextStyle(color: Colors.white), ), ), ), ), ], ), ); } } 🎬 Fade Animation ZebaFadeVisibility( isVisible: true, child: Container( height: 150, color: Colors.green, child: const Center( child: Text("Fade In"), ), ), ) 🎞️ Slide Animation ZebaSlideVisibility( isVisible: true, beginOffset: Offset(0, 0.3), child: Container( height: 150, color: Colors.orange, child: const Center( child: Text("Slide In"), ), ), ) 🔁 Once Only Trigger final controller = VisibilityController();

if (controller.hasBeenVisible) { debugPrint("Widget already visible once"); } 📊 Visibility Properties Property Description isVisible Current visibility state visibleFraction Visibility percentage (0.0 - 1.0) hasBeenVisible True once widget is seen ⚙️ How It Works Detects widget position on screen Compares with viewport bounds Calculates visible portion Converts to percentage Triggers updates via controller 📁 Package Structure lib/ ├── zeba_academy_visibility.dart ├── src/ │ ├── visibility_detector_widget.dart │ ├── visibility_builder.dart │ ├── visibility_controller.dart │ ├── animation/ │ │ ├── fade_visibility.dart │ │ ├── slide_visibility.dart ⚡ Use Cases Scroll-based animations Content engagement tracking Feed-style UI (Instagram-like apps) Learning apps (Zeba Academy use case) Lazy animation loading 🧪 Example App

See /example folder for full working demo.

📜 License

This package is licensed under:

GNU General Public License v3.0 (GPL-3.0)

You are free to:

Use Modify Distribute

But any modified version must remain open-source under GPL-3.0.

👨‍💻 About Developer

✨ Sufyan bin Uzayr Open-source developer passionate about building useful Flutter tools.

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

🎓 Zeba Academy

🚀 Learn coding & development at:

https://zeba.academy https://code.zeba.academy https://www.youtube.com/@zeba.academy https://www.instagram.com/zeba.academy 💙 Final Note

If you like this package, consider ⭐ starring the repo and contributing.