app_lang_selector #

A Flutter package for easy language selection with beautiful UI and state management support. This package provides ready-to-use widgets for language selection with support for multiple languages and seamless integration with easy_localization and riverpod.

Features #

✨ Easy Integration: Drop-in widgets for language selection
🌍 Multi-language Support: Supports 40+ languages with native names
🎨 Beautiful UI: Material Design 3 compatible interface
📱 Responsive Design: Works on all screen sizes
🔄 State Management: Built-in Riverpod state management
⚡ Fast Performance: Optimized for smooth user experience
🎯 Easy Localization: Seamless integration with easy_localization package

Supported Languages #

The package includes native names for 40+ languages including:

• English, 日本語, 简体中文, 繁體中文, 한국어
• Español, Français, Deutsch, Italiano, Português
• Русский, العربية, Tiếng Việt, हिंदी, Polski
• And many more...

Getting Started #

Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  app_lang_selector: ^0.0.1
  easy_localization: ^3.0.7
  flutter_riverpod: ^2.6.1

Then run:

flutter pub get

Basic Setup #

1. Wrap your app with required providers:

import 'package:app_lang_selector/app_lang_selector.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyLocalization.ensureInitialized();

  runApp(
    EasyLocalization(
      supportedLocales: [
        Locale('en', 'US'),
        Locale('ja', 'JP'),
        Locale('zh', 'CN'),
        // Add your supported locales
      ],
      path: 'assets/localizations',
      fallbackLocale: Locale('en', 'US'),
      child: ProviderScope(
        child: MyApp(),
      ),
    ),
  );
}

2. Add language selection to your UI:

// Simple tile for settings page
const AppLangSelectTile()

// Or use the full page directly
Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => const AppLangSelectPage(),
  ),
);

Example App #

A complete example app is included in the example/ directory. To run it:

cd example
flutter pub get
flutter run

The example demonstrates:

• Complete app setup with multiple languages
• Integration with easy_localization
• Language selection UI
• State persistence

Advanced Usage #

Custom Language Names #

You can customize the language display names by modifying the langsNameMap in your implementation:

final customLangsNameMap = {
  const LangCode(languageCode: 'en', countryCode: 'US'): 'English (US)',
  const LangCode(languageCode: 'ja', countryCode: 'JP'): '日本語',
  // Add your custom mappings
};

State Management #

The package uses Riverpod for state management. You can access the current language selection:

final selectedLang = ref.watch(selectingLangProvider);

Requirements #

• Flutter >=1.17.0
• Dart >=3.0.0
• easy_localization ^3.0.7
• flutter_riverpod ^2.6.1

Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

License #

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

Support #

If you find this package helpful, please consider giving it a ⭐ on GitHub!