🧩 Context Helpers

A lightweight Flutter utility package providing expressive and powerful extensions on BuildContext.

Simplify access to MediaQuery, Theme, Navigation, Localization, and Responsive utilities — making your UI code cleaner, faster, and more readable.

✨ Features

Feature	Description
📏 Quick Size Access	Replace `MediaQuery.of(context).size.width` with `context.width`
🎨 Theme Shortcuts	Access theme and color schemes instantly via `context.theme` or `context.colorScheme`
🧭 Simplified Navigation	Push, pop, and replace routes with one-liners
🌍 Localization Access	Get current locale, language, and region easily
📱 Responsive Utilities	Detect `context.isMobile`, `context.isTablet`, `context.isDesktop`
⚡ SnackBar Helper	Show messages instantly using `context.showSnackBar()`
🧠 Intuitive Syntax	Readable, concise, and fully null-safe

🚀 Getting Started

Installation

Add context_helpers to your pubspec.yaml:

dependencies:
  context_helpers: ^1.0.0

Then run:

flutter pub get

Import

import 'package:context_helpers/context_helpers.dart';

💡 Usage Examples

Basic Example

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Width: ${context.width.toStringAsFixed(0)}'),
        backgroundColor: context.colorScheme.primary,
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // Locale Access
            Text(
              'Locale: ${context.locale.languageCode.toUpperCase()}',
              style: context.textTheme.headlineMedium,
            ),
            
            const SizedBox(height: 20),
            
            // Responsive Detection
            Text(
              'Device Type: ${context.isMobile ? "📱 Mobile" : context.isTablet ? "📱 Tablet" : "💻 Desktop"}',
              style: context.textTheme.titleLarge,
            ),
            
            const SizedBox(height: 30),
            
            // SnackBar Helper
            ElevatedButton(
              onPressed: () => context.showSnackBar('Hello from Context Helpers! 👋'),
              child: const Text('Show Snackbar'),
            ),
            
            const SizedBox(height: 10),
            
            // Navigation Helper
            ElevatedButton(
              onPressed: () => context.push(const SecondPage()),
              child: const Text('Navigate to Second Page'),
            ),
          ],
        ),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Second Page')),
      body: Center(
        child: ElevatedButton(
          onPressed: () => context.pop(),
          child: const Text('⬅️ Go Back'),
        ),
      ),
    );
  }
}

Responsive Layout Example

Widget build(BuildContext context) {
  return Container(
    width: context.width,
    height: context.height * 0.5,
    child: Center(
      child: Text(
        context.isMobile
            ? '📱 Mobile Layout'
            : context.isTablet
                ? '📱 Tablet Layout'
                : '💻 Desktop Layout',
        style: context.textTheme.headlineSmall?.copyWith(
          color: context.colorScheme.primary,
        ),
      ),
    ),
  );
}

Theme Access Example

Container(
  color: context.colorScheme.primaryContainer,
  child: Text(
    'Styled with Theme Colors',
    style: context.textTheme.bodyLarge?.copyWith(
      color: context.colorScheme.onPrimaryContainer,
    ),
  ),
)

Localization Example

Column(
  children: [
    Text('Language: ${context.languageCode}'),
    Text('Country: ${context.countryCode}'),
    Text('Full Locale: ${context.locale}'),
  ],
)

⚙️ Complete API Reference

📏 Size & Dimensions

Extension	Type	Description	Example
`context.width`	`double`	Screen width	`context.width` → `390.0`
`context.height`	`double`	Screen height	`context.height` → `844.0`

🎨 Theme Access

Extension	Type	Description
`context.theme`	`ThemeData`	Current theme data
`context.colorScheme`	`ColorScheme`	Material color scheme
`context.textTheme`	`TextTheme`	Typography theme

Extension	Return Type	Description	Example
`context.navigator`	`NavigatorState`	Direct navigator access	`context.navigator.pushNamed('/home')`
`context.push(page)`	`Future<T?>`	Push new route	`context.push(DetailPage())`
`context.pop()`	`void`	Pop current route	`context.pop()`

🌍 Localization

Extension	Type	Description	Example
`context.locale`	`Locale`	Current locale	`Locale('en', 'US')`
`context.languageCode`	`String`	Language code	`'en'`
`context.countryCode`	`String?`	Country code	`'US'`

📱 Responsive Utilities

Extension	Type	Breakpoint	Description
`context.isMobile`	`bool`	`< 600px`	Returns `true` for mobile devices
`context.isTablet`	`bool`	`≥ 600px & < 1024px`	Returns `true` for tablets
`context.isDesktop`	`bool`	`≥ 1024px`	Returns `true` for desktop screens

⚡ UI Helpers

Extension	Parameters	Description
`context.showSnackBar(message)`	`String message`	Display a snackbar with message

🔧 Setup for Localization

To use localization features, configure your MaterialApp:

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:context_helpers/context_helpers.dart';

void main() => runApp(const MyApp());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Context Helpers Demo',
      
      // Add localization delegates
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      
      // Define supported locales
      supportedLocales: const [
        Locale('en', 'US'),
        Locale('hi', 'IN'),
        Locale('es', 'ES'),
      ],
      
      home: const HomePage(),
    );
  }
}

🔧 Platform Support

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

🐛 Troubleshooting

Error: `Undefined name 'GlobalWidgetsLocalizations'`

Solution: Add the import at the top of your file:

import 'package:flutter_localizations/flutter_localizations.dart';

Error: `No MaterialLocalizations found`

Solution: Ensure you've added localizationsDelegates and supportedLocales in your MaterialApp:

MaterialApp(
  localizationsDelegates: const [
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
  ],
  supportedLocales: const [Locale('en', 'US')],
  // ...
)

🤝 Contributing

Contributions are welcome! If you'd like to add new helpers or improve existing ones:

Fork this repository
Create a feature branch (git checkout -b feature/amazing-helper)
Commit your changes (git commit -m 'Add amazing helper')
Push to the branch (git push origin feature/amazing-helper)
Open a Pull Request

Ideas for Contributions

context.deviceType - Enhanced device detection
context.safePadding - Safe area padding access
context.responsive() - Widget builder for responsive layouts
context.textScale - Text scaling factor
More theme shortcuts and utilities

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🧑‍💻 Author

Rahul Sharma

🐙 GitHub: @rahulk3sharmadev
📧 Email: rahulk3sharmadev@gmail.com
💼 LinkedIn: Rahul Sharma

💖 Support This Package

If you find Context Helpers useful:

⭐ Star this repo on GitHub
👍 Like it on pub.flutter-io.cn
🐞 Report issues or request features here
📢 Share with the Flutter community

🗺️ Roadmap

Add context.responsive() widget builder
Add context.textScale shortcut
Add context.safeArea and context.inset helpers
Add context.appTheme for theme extensions
Add context.mediaQuery for full MediaQueryData access
Comprehensive unit tests for all helpers
Add more navigation helpers (pushReplacement, pushAndRemoveUntil)

📈 Changelog

See CHANGELOG.md for a detailed version history.

🙏 Acknowledgments

Inspired by community-driven context extensions from:

Special thanks to the Flutter community for continuous inspiration and excellent open-source practices.

Made with ❤️ by Rahul Sharma

Happy Coding! 🚀

🧩 Context Helpers

✨ Features

🚀 Getting Started

Installation

Import

💡 Usage Examples

Basic Example

Responsive Layout Example

Theme Access Example

Localization Example

⚙️ Complete API Reference

📏 Size & Dimensions

🎨 Theme Access

🧭 Navigation

🌍 Localization

📱 Responsive Utilities

⚡ UI Helpers

🔧 Setup for Localization

🔧 Platform Support

🐛 Troubleshooting

Error: `Undefined name 'GlobalWidgetsLocalizations'`

Error: `No MaterialLocalizations found`

🤝 Contributing

Ideas for Contributions

📄 License

🧑‍💻 Author

💖 Support This Package

🗺️ Roadmap

📈 Changelog

🙏 Acknowledgments

Libraries

context_helpers package

🧩 Context Helpers

✨ Features

🚀 Getting Started

Installation

Import

💡 Usage Examples

Basic Example

Responsive Layout Example

Theme Access Example

Localization Example

⚙️ Complete API Reference

📏 Size & Dimensions

🎨 Theme Access

🧭 Navigation

🌍 Localization

📱 Responsive Utilities

⚡ UI Helpers

🔧 Setup for Localization

🔧 Platform Support

🐛 Troubleshooting

Error: Undefined name 'GlobalWidgetsLocalizations'

Error: No MaterialLocalizations found

🤝 Contributing

Ideas for Contributions

📄 License

🧑‍💻 Author

💖 Support This Package

🗺️ Roadmap

📈 Changelog

🙏 Acknowledgments

Libraries

context_helpers package

Error: `Undefined name 'GlobalWidgetsLocalizations'`

Error: `No MaterialLocalizations found`