zeba_academy_tab_system

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

pub version platform license


✨ 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!