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.