zeba_academy_layout 1.0.0

A lightweight Flutter responsive layout engine built under Zeba Academy. It provides adaptive layouts, breakpoints, and responsive widgets for mobile, tablet, and desktop applications.

📦 Zeba Academy Layout

A powerful responsive layout engine for Flutter applications built under the Zeba Academy ecosystem.

🚀 Overview

Zeba Academy Layout helps you build fully responsive Flutter apps with ease. It provides:

Adaptive layout system Mobile / Tablet / Desktop support Clean breakpoint management Simple responsive widgets Developer-friendly extensions

Perfect for building modern, scalable, cross-device UI systems.

✨ Features 📱 Mobile, Tablet, Desktop detection ⚡ Breakpoint-based responsive system 🧠 Smart layout engine using MediaQuery 🔧 Easy-to-use responsive builder widget 🧩 Context extensions (context.isMobile, etc.) 📐 Scalable architecture for large apps 🎯 Lightweight & performance optimized 📦 Installation

Add this to your pubspec.yaml:

dependencies: zeba_academy_layout: ^1.0.0

Then run:

flutter pub get 🧠 Getting Started

Import the package:

import 'package:zeba_academy_layout/zeba_academy_layout.dart'; 📱 Basic Usage Detect Device Type if (ZebaLayout.isMobile(context)) { return const Text("Mobile UI"); } Use Responsive Builder ZebaResponsiveBuilder( builder: (context, device) { switch (device) { case ZebaDeviceType.mobile: return const Text("Mobile Layout");

  case ZebaDeviceType.tablet:
    return const Text("Tablet Layout");

  case ZebaDeviceType.desktop:
    return const Text("Desktop Layout");
}

}, ); Context Extensions (Recommended) if (context.isDesktop) { return const Sidebar(); } 📐 Breakpoints

Default breakpoints used in this package:

Device Width Range Mobile < 600px Tablet < 1024px Desktop ≥ 1024px

You can customize these in:

ZebaBreakpoints 🧩 Example Scaffold( body: ZebaResponsiveBuilder( builder: (context, device) { return GridView.count( crossAxisCount: device == ZebaDeviceType.mobile ? 1 : device == ZebaDeviceType.tablet ? 2 : 4, children: List.generate( 20, (index) => Card( child: Center(child: Text("Item $index")), ), ), ); }, ), ); 📁 Package Structure lib/ ├── zeba_academy_layout.dart ├── src/ │ ├── breakpoints.dart │ ├── device_type.dart │ ├── zeba_layout.dart │ ├── responsive_builder.dart │ ├── layout_extensions.dart 🔮 Future Improvements Percentage-based layout system Orientation-aware layouts Fluid typography scaling Advanced grid system Nested responsive builders Animation-aware responsiveness 🧪 Testing

Run tests using:

flutter test 👨‍💻 About Me

✨ I’m Sufyan bin Uzayr, an open-source developer passionate about building and sharing meaningful projects. Learn more: https://sufyanism.com LinkedIn: https://www.linkedin.com/in/sufyanism

🌐 Zeba Academy

🚀 Your all-in-one learning hub for coding and development.

🔗 Website: https://zeba.academy 🔗 Courses: https://code.zeba.academy 🎥 YouTube: https://www.youtube.com/@zeba.academy 📸 Instagram: https://www.instagram.com/zeba.academy 📜 License

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

You are free to:

Use Modify Distribute

Under the condition that:

Source code must remain open Any modifications must also be open-source under GPL

See full license: https://www.gnu.org/licenses/gpl-3.0.html

⭐ Support

If you like this project, consider:

⭐ Starring the repository 🧠 Contributing improvements 🚀 Sharing with the developer community