zeba_academy_learning_path 1.0.1

Animated learning path widget with lessons, XP, badges and progress tracking.

zeba_academy_learning_path

A beautiful and customizable Flutter widget for building gamified learning experiences with animated learning paths, lesson progression, XP tracking, achievement badges, and course journey visualization.

Features

✨ Animated learning journey

🔒 Locked and unlocked lessons

📈 Progress tracking

🏆 Achievement badges

⭐ XP points system

🎨 Modern Material Design UI

⚡ Smooth animations

🧪 Fully tested

📱 Responsive layout

Preview

Create engaging educational experiences inspired by modern e-learning platforms.

Features include:

• Lesson progression
• Learning path visualization
• Course milestones
• Achievement rewards
• XP tracking
• Animated transitions

Installation

Add the package to your pubspec.yaml:

dependencies:
  zeba_academy_learning_path: ^1.0.0

Then run:

flutter pub get

Import

import 'package:zeba_academy_learning_path/zeba_academy_learning_path.dart';

Basic Usage

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Learning Path'),
      ),
      body: ZebaLearningPath(
        totalXp: 450,
        lessons: const [
          LessonNode(
            title: 'Introduction',
            completed: true,
            locked: false,
          ),
          LessonNode(
            title: 'Flutter Basics',
            completed: true,
            locked: false,
          ),
          LessonNode(
            title: 'State Management',
            completed: false,
            locked: false,
          ),
          LessonNode(
            title: 'Animations',
            completed: false,
            locked: true,
          ),
        ],
        badges: const [
          BadgeModel(
            title: 'Beginner',
            icon: Icons.star,
          ),
          BadgeModel(
            title: 'Fast Learner',
            icon: Icons.emoji_events,
          ),
        ],
      ),
    );
  }
}

LessonNode

Represents a lesson in the learning path.

LessonNode(
  title: 'Flutter Basics',
  completed: true,
  locked: false,
)

Properties

Property	Type	Description
title	String	Lesson title
completed	bool	Completion status
locked	bool	Locked status

BadgeModel

Represents an achievement badge.

BadgeModel(
  title: 'Top Performer',
  icon: Icons.emoji_events,
)

Properties

Property	Type	Description
title	String	Badge title
icon	IconData	Badge icon

ZebaLearningPath

Main widget for rendering the complete learning experience.

Parameters

Parameter	Type	Required
lessons	List	Yes
badges	List	Yes
totalXp	int	Yes
enableAnimations	bool	No

Example

ZebaLearningPath(
  totalXp: 1200,
  enableAnimations: true,
  lessons: lessons,
  badges: badges,
)

Customization

Control animations during testing:

ZebaLearningPath(
  enableAnimations: false,
  lessons: lessons,
  badges: badges,
  totalXp: 100,
)

Testing

Run tests:

flutter test

Analyze package:

flutter analyze

License

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

See the LICENSE file for details.

---

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.

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: https://code.zeba.academy

➡ YouTube: https://www.youtube.com/@zeba.academy

➡ Instagram: https://www.instagram.com/zeba.academy/

Thank you for visiting and supporting open-source development.