zeba_academy_learning_path_ui

License: GPL v3 Flutter Dart

A beautiful Flutter package for creating interactive learning roadmaps, milestone tracking systems, achievement markers, progress visualization, and goal tracking experiences.

Perfect for educational apps, LMS platforms, skill development apps, coding bootcamps, career roadmaps, onboarding flows, and gamified learning experiences.

✨ Features

✅ Learning Roadmaps

✅ Milestone Tracking

✅ Achievement Markers

✅ Progress Visualization

✅ Goal Tracking

✅ Timeline-Based Learning Paths

✅ Clean Material Design UI

✅ Highly Customizable Components

✅ Responsive Layouts

✅ Light & Dark Theme Support

✅ Flutter Web, Android, iOS, Windows, Linux & macOS Support

📸 Preview

Build engaging learning journeys such as:

  • Flutter Developer Roadmap
  • Full Stack Developer Path
  • Data Science Journey
  • UI/UX Learning Track
  • School Learning Progress
  • Employee Training Programs
  • Course Completion Trackers

🚀 Installation

Add the package to your pubspec.yaml:

dependencies:
  zeba_academy_learning_path_ui: ^1.0.0

Install dependencies:

flutter pub get

📦 Import

import 'package:zeba_academy_learning_path_ui/zeba_academy_learning_path_ui.dart';

Quick Start

Create a Learning Path

final path = LearningPath(
  title: "Flutter Developer",
  description: "Complete Flutter Development Roadmap",
  milestones: [
    Milestone(
      title: "Dart Basics",
      description: "Learn variables and functions",
      completed: true,
      progress: 1.0,
    ),
    Milestone(
      title: "Flutter Widgets",
      description: "Master Flutter widgets",
      progress: 0.7,
    ),
    Milestone(
      title: "State Management",
      description: "Learn Provider & Riverpod",
      progress: 0.3,
    ),
  ],
);

Display Learning Path

LearningPathView(
  path: path,
)

Goal Tracker

GoalTracker(
  completedGoals: 4,
  totalGoals: 10,
)

Achievement Badge

AchievementBadge(
  title: "Flutter Expert",
  icon: Icons.emoji_events,
)

Progress Header

ProgressHeader(
  progress: 0.75,
)

Complete Example

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

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

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

  @override
  Widget build(BuildContext context) {

    final path = LearningPath(
      title: "Flutter Roadmap",
      description: "Learn Flutter from Beginner to Advanced",
      milestones: [
        Milestone(
          title: "Dart Basics",
          description: "Variables and Functions",
          completed: true,
          progress: 1.0,
        ),
        Milestone(
          title: "Flutter Widgets",
          description: "Master Widgets",
          progress: 0.7,
        ),
        Milestone(
          title: "State Management",
          description: "Provider & Riverpod",
          progress: 0.3,
        ),
      ],
    );

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("Learning Path"),
        ),
        body: LearningPathView(
          path: path,
        ),
      ),
    );
  }
}

Included Widgets

Widget Description
LearningPathView Displays complete learning roadmap
MilestoneCard Displays milestone details
ProgressHeader Displays overall progress
GoalTracker Tracks goal completion
AchievementBadge Displays achievements and rewards

Use Cases

  • Learning Management Systems (LMS)
  • Coding Academies
  • Online Courses
  • Employee Training Platforms
  • Student Progress Tracking
  • Career Roadmaps
  • Certification Programs
  • Skill Development Apps
  • Coaching Institutes
  • Gamified Learning Platforms

Platform Support

Platform Supported
Android ✅
iOS ✅
Web ✅
Windows ✅
Linux ✅
macOS ✅

Roadmap

Future planned features:

  • Animated Roadmaps
  • XP & Points System
  • Learning Streak Tracking
  • Achievement Unlock Animations
  • Curved Timeline Paths
  • Custom Connectors
  • Locked Milestones
  • Certificate Cards
  • Gamification Components
  • Premium Themes
  • SVG Asset Support

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.

Empower yourself with practical skills through curated tutorials, real-world projects, and hands-on experience.

Explore

➡ Main Website: https://zeba.academy

➡ Learning Portal: https://code.zeba.academy

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

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

❤️ Contributing

Contributions, issues, and feature requests are welcome.

If you would like to improve this package, feel free to fork the repository and submit a pull request.

⭐ Support

If you find this package useful, please consider giving it a star and sharing it with the Flutter community.

Happy Coding! 🚀

Libraries

zeba_academy_learning_path_ui