zeba_academy_tab_system 0.0.1

A customizable Flutter tab system with animated switching, custom indicators, nested tabs, and PageView synchronization.

zeba_academy_tab_system

A powerful and customizable Flutter tab system with animated switching, custom indicators, nested tabs, scrollable tabs, and seamless PageView synchronization.

---

✨ Features

✅ Scrollable tabs
✅ Custom indicators
✅ Animated tab switching
✅ Nested tabs support
✅ PageView synchronization
✅ Easy customization
✅ Clean architecture
✅ Production-ready components
✅ Lightweight and fast

---

📦 Installation

Add this to your pubspec.yaml:

dependencies:
  zeba_academy_tab_system: ^0.0.1

Then run:

flutter pub get

---

🚀 Import

import 'package:zeba_academy_tab_system/zeba_academy_tab_system.dart';

---

🔥 Basic Usage

import 'package:flutter/material.dart';
import 'package:zeba_academy_tab_system/zeba_academy_tab_system.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage>
    with TickerProviderStateMixin {
  late ZebaTabController controller;

  final tabs = [
    ZebaTabModel(
      title: 'Home',
      icon: Icons.home,
      child: const Center(
        child: Text('Home Page'),
      ),
    ),
    ZebaTabModel(
      title: 'Courses',
      icon: Icons.book,
      child: const Center(
        child: Text('Courses Page'),
      ),
    ),
    ZebaTabModel(
      title: 'Profile',
      icon: Icons.person,
      child: const Center(
        child: Text('Profile Page'),
      ),
    ),
  ];

  @override
  void initState() {
    super.initState();

    controller = ZebaTabController();

    controller.init(
      vsync: this,
      length: tabs.length,
    );
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Zeba Academy Tabs'),
        bottom: PreferredSize(
          preferredSize: const Size.fromHeight(50),
          child: ZebaTabBar(
            tabs: tabs,
            controller: controller,
            indicatorColor: Colors.deepPurple,
          ),
        ),
      ),
      body: ZebaTabView(
        tabs: tabs,
        controller: controller,
      ),
    );
  }
}

---

🎨 Custom Indicator

ZebaTabBar(
  tabs: tabs,
  controller: controller,
  indicatorColor: Colors.red,
)

---

📜 Scrollable Tabs

ZebaTabBar(
  tabs: tabs,
  controller: controller,
  isScrollable: true,
)

---

🔄 PageView Sync

The package automatically synchronizes:

• TabBar
• PageView
• Swipe gestures
• Animated transitions

No extra setup required.

---

🧩 Nested Tabs Example

DefaultTabController(
  length: 2,
  child: Column(
    children: [
      TabBar(
        tabs: const [
          Tab(text: 'Tab 1'),
          Tab(text: 'Tab 2'),
        ],
      ),
      Expanded(
        child: TabBarView(
          children: [
            Center(child: Text('Tab 1')),
            Center(child: Text('Tab 2')),
          ],
        ),
      ),
    ],
  ),
)

---

📚 API Reference

Widget	Description
ZebaTabBar	Customizable tab bar
ZebaTabView	Animated PageView synced tab view
ZebaTabController	Controls tabs and pages
ZebaNestedTabView	Nested tabs support
ZebaTabModel	Tab model class

---

⚙️ Properties

ZebaTabBar

Property	Type	Default
tabs	List<ZebaTabModel>	required
controller	ZebaTabController	required
isScrollable	bool	true
indicatorColor	Color	Colors.blue
selectedColor	Color	Colors.black
unselectedColor	Color	Colors.grey

---

🧪 Testing

Run tests:

flutter test

---

📁 Project Structure

lib/
│
├── zeba_academy_tab_system.dart
│
├── src/
│   ├── controllers/
│   ├── models/
│   └── widgets/

---

🚀 Future Improvements

• Badge tabs
• Gradient indicators
• Vertical tabs
• Cupertino tabs
• RTL support
• Lazy loading
• Blur animations
• Tab persistence

---

🤝 Contributing

Contributions are welcome!

Feel free to:

• Open issues
• Submit pull requests
• Suggest improvements

---

📄 License

This project is licensed under the MIT License.

---

## 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 sufyanism.com or connect with me on Linkedin

---

## 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 hands-on courses and resources at: https://code.zeba.academy
➡ Check out our YouTube for more tutorials: https://www.youtube.com/@zeba.academy
➡ Follow us on Instagram: https://www.instagram.com/zeba.academy/

---

❤️ Support

If you like this package, please give it a ⭐ on GitHub and share it with the Flutter community!

---

Thank you for visiting!