zeba_academy_infographic_ui 1.0.0
zeba_academy_infographic_ui: ^1.0.0 copied to clipboard
Beautiful infographic widgets for Flutter including process diagrams, comparison layouts, statistics cards, timeline infographics, and visual storytelling components.
Zeba Academy Infographic UI #
A powerful Flutter package for building beautiful and engaging infographic-style user interfaces. Create process diagrams, comparison layouts, statistics widgets, timeline infographics, and visual storytelling experiences with minimal effort.
⨠Features #
š Process Diagrams #
Create visually appealing step-by-step workflows and process flows.
āļø Comparison Layouts #
Display side-by-side comparisons with clean and professional designs.
š Statistics Widgets #
Show KPIs, metrics, and numerical insights using elegant statistic cards.
š Timeline Infographics #
Present chronological events with customizable timeline components.
š Visual Storytelling #
Build engaging narratives and user journeys using storytelling widgets.
šØ Material Design #
Fully compatible with Flutter's Material Design system.
š± Responsive #
Works across mobile, tablet, desktop, and web applications.
š”ļø Null Safe #
Built with modern Dart and full null-safety support.
Installation #
Add the package to your pubspec.yaml:
dependencies:
zeba_academy_infographic_ui: ^1.0.0
Install dependencies:
flutter pub get
Import #
import 'package:zeba_academy_infographic_ui/zeba_academy_infographic_ui.dart';
Process Diagram Example #
ZebaProcessDiagram(
steps: [
ProcessStep(
title: 'Plan',
description: 'Define project goals',
icon: Icons.lightbulb,
),
ProcessStep(
title: 'Build',
description: 'Develop application',
icon: Icons.code,
),
ProcessStep(
title: 'Launch',
description: 'Release to users',
icon: Icons.rocket_launch,
),
],
)
Statistics Card Example #
const ZebaStatisticCard(
title: 'Users',
value: '10K+',
icon: Icons.people,
)
Timeline Example #
ZebaTimeline(
events: [
TimelineEvent(
title: 'Project Started',
subtitle: 'Initial planning phase',
date: 'Jan 2026',
),
TimelineEvent(
title: 'Launch',
subtitle: 'Public release',
date: 'Jun 2026',
),
],
)
Comparison Layout Example #
ZebaComparisonCard(
leftTitle: 'Flutter',
rightTitle: 'Native',
leftFeatures: [
'Single Codebase',
'Fast Development',
'Cross Platform',
],
rightFeatures: [
'Platform Specific',
'Separate Teams',
'Higher Cost',
],
)
Visual Storytelling Example #
ZebaStoryFlow(
items: [
StoryItem(
title: 'Idea',
description: 'The project concept begins.',
),
StoryItem(
title: 'Development',
description: 'Building the solution.',
),
StoryItem(
title: 'Success',
description: 'Launch and growth.',
),
],
)
Roadmap #
Future releases may include:
- Animated Infographics
- Interactive Timelines
- Flowchart Connectors
- KPI Dashboards
- Milestone Widgets
- Circular Statistics
- SVG Support
- Custom Themes
- Responsive Grid Infographics
- Advanced Storytelling Components
License #
This project is licensed under the GNU General Public License v3.0 (GPL-3.0).
You are free to:
- Use
- Modify
- Distribute
- Contribute
under the terms of the GPL-3.0 License.
See the LICENSE file for complete 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:
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.
š» Level up your tech game today!
Resources #
- Main Website: https://zeba.academy
- Coding 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 contribute:
- Fork the repository
- Create a feature branch
- Commit your changes
- Submit a pull request
Support #
If you find this package useful, consider:
ā Starring the repository
š¢ Sharing it with the Flutter community
š¤ Contributing improvements
Thank you for using Zeba Academy Infographic UI!