Flutter Addons is a powerful micro-extension framework built to accelerate Flutter app development. Designed with responsiveness, theming, and developer productivity in mind, it lets you build scalable, pixel-perfect, and theme-aware applications with minimal boilerplate.

By providing intuitive extensions, responsive layout tools, and advanced theming capabilities, Flutter Addons helps you reduce development time by up to 7×, so you can focus on delivering beautiful user experiences faster.

⚡ Boost your Flutter workflow and unlock greater productivity with the Flutter Addons VS Code Extension.

Key Features

• Seamless Responsiveness: Effortlessly adapt your UI across devices with ResponsiveScope and smart scaling utilities.
• Powerful Theming: Define consistent colors, typography, and style systems with the Soul Theme Engine.
• Dart Extensions: Clean and readable syntax helpers for common types like String, Map, bool, and more.
• Context Helpers: Easy access to media queries, theme data, text styles, and more from the BuildContext.
• Flexible Layout Widgets: Ready-to-use rows, columns, grids, and stacks that simplify complex UI arrangements.
• Smooth Navigation & Animations: Built-in routing helpers paired with elegant transition effects.
• Utility Toolkit: Debugging aids, network helpers, error handling, math & time utilities all in one place.
• Image & Color Processing: Extract dominant colors, apply filters, and manipulate images effortlessly.
• Error & DPI Awareness: Customizable error screens and density-aware layouts for flawless rendering.

⚙️ Initialization

ResponsiveScope( // 👈  ResponsiveScope — VERY Important: Manages layout scaling, orientation lock, and global error handling
  enableDebugLogging: true, // Enable debug logs for responsive layout changes
  screenLock: AppOrientationLock.none, // No orientation restriction
  errorScreen: ErrorScreen.blueCrash, // Custom error screen for uncaught Flutter errors
  designFrame: const DesignFrame(width: 390, height: 844), // Base design frame for scaling (e.g., iPhone 13)
  scaleMode: ScaleMode.design, // Use design-based scaling for consistent UI
  layoutBuilder: (ui)=>  MobileApp(),
);

📐 Responsive Units

Smooth scaling across devices. Use one mode globally for consistency.

⚡ Check out the example app for a quick understanding: View Example App.

💎 Effortless Theming with Soul — Quickstart Guide

1. Create Custom Colors
   Extend ThemeKolors and override colors:

   class CustomColors extends ThemeKolors {
     @override
     Color get primaryColor => Color(0xFF4A90E2);
     // override other colors...
   }```
   
   

2. Create Custom Typography Extend AppTypo and define text styles:

   class CustomTypography extends AppTypo {
     @override
     String get fontFamily => 'Montserrat';
     @override
     TextStyle get bodyText => TextStyle(fontSize: 16.sp);
     // define more styles...
   }
   

3. Generate Theme Use ThemeMaker.makeTheme with your custom classes:

   ThemeData get lightTheme =>
      ThemeMaker.makeTheme(AppLightColors(), typography: AppFonts());
   
   

🎨 Apply the Theme

Use your custom theme in MaterialApp. By Extending ThemeManager create your own controller that handles theme state and switching logic more easily. See the example app.

class Themer extends ThemeManager {
 static const _themeKey = 'selected_theme';

 Themer() {
   _loadThemeFromPrefs(); // Load theme on initialization
 }

 @override
 ThemeData get lightTheme =>
     ThemeMaker.makeTheme(AppLightColors(), typography: AppFonts());

 @override
 ThemeData get darkTheme =>
     ThemeMaker.makeTheme(AppDarkColors(), typography: AppFonts());
}

1. Applying Text Styles

You can use the extension on num to apply various text styles directly.

Text(
  "Hello, World!",
  style: 16.t.bold.italic.k(Colors.blue),
);

2. Using Predefined TextTheme Styles from BuildContext

Easily access text styles from the app's ThemeData.

Text(
  "Title Text",
  style: context.titleLarge,
);

📏 Spacing Extension Reference

The Spacing extension provides quick, expressive syntax for margins, paddings, and spacing widgets based on integer values.

🔁 Async utility extension:

📅 DateTime Extension Overview

💱 Currency Conversion Extensions

Navigation Extension Usage

Available animations

enum AnimationType { fade, slideFromRight, slideFromLeft, scale, rotate,rotatescale }

Navigation Extensions

🪄 Avoid Using Print Statements

Instead of using print for debugging, leverage a dedicated logging system for clearer, more structured output. Below is an example using a custom Debug class to log messages with different severity levels:

Using a structured logging system allows better control and visibility over your app’s runtime behavior, making it easier to debug and maintain.

📚 Learn More

• 🎨 Soul Theme Engine – Custom theming, typography, and dynamic themes.
• 📐 Responsive System – Scale UI across devices based on design frame.
• 🎞️ Animation Utils – Physics, curves, transitions, and more.
• 🧩 Widget Extensions – Margin, padding, size, and layout extensions.

📬 Contributions & Support

Contributions are welcome! If you have any feature requests, bug reports, or suggestions,
feel free to submit an issue or a pull request on GitHub.

👨‍💻 Author

Flutter Addons is actively maintained by AR Rahman. For questions, suggestions, or collaboration opportunities, feel free to reach out.

If you find this package helpful, please consider giving it a ⭐️ on GitHub — your support is greatly appreciated! 🚀