LanguageSwitcher

Introduction

Le widget LanguageSwitcher offre un moyen simple de gerer le changement de langue dans vos projets Nylo Website. Il detecte automatiquement les langues disponibles dans votre repertoire /lang et les affiche a l'utilisateur.

Que fait LanguageSwitcher ?

• Affiche les langues disponibles depuis votre repertoire /lang
• Change la langue de l'application lorsque l'utilisateur en selectionne une
• Persiste la langue selectionnee entre les redemarrages de l'application
• Met automatiquement a jour l'interface lorsque la langue change

Note : Si votre application n'est pas encore localisee, apprenez comment le faire dans la documentation de Localisation avant d'utiliser ce widget.

Widget Dropdown

La maniere la plus simple d'utiliser LanguageSwitcher est en tant que dropdown dans votre barre d'application :

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text("Settings"),
      actions: [
        LanguageSwitcher(), // Add to the app bar
      ],
    ),
    body: Center(
      child: Text("Hello World".tr()),
    ),
  );
}

Lorsque l'utilisateur appuie sur le dropdown, il verra une liste des langues disponibles. Apres avoir selectionne une langue, l'application basculera automatiquement et mettra a jour l'interface.

Modal en bas de page

Vous pouvez egalement afficher les langues dans un modal en bas de page :

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Center(
      child: MaterialButton(
        child: Text("Change Language"),
        onPressed: () {
          LanguageSwitcher.showBottomModal(context);
        },
      ),
    ),
  );
}

Le modal en bas de page affiche une liste de langues avec une coche a cote de la langue actuellement selectionnee.

Personnaliser la hauteur du modal

LanguageSwitcher.showBottomModal(
  context,
  height: 300, // Custom height
);

Constructeur de dropdown personnalise

Personnalisez l'apparence de chaque option de langue dans le dropdown :

LanguageSwitcher(
  dropdownBuilder: (Map<String, dynamic> language) {
    return Row(
      children: [
        Icon(Icons.language),
        SizedBox(width: 8),
        Text(language['name']), // e.g., "English"
        // language['locale'] contains the locale code, e.g., "en"
      ],
    );
  },
)

Gerer les changements de langue

LanguageSwitcher(
  onLanguageChange: (Map<String, dynamic> language) {
    print('Language changed to: ${language['name']}');
    // Perform additional actions when language changes
  },
)

Parametres

Methodes statiques

Obtenir la langue actuelle

Recuperez la langue actuellement selectionnee :

Map<String, dynamic>? lang = await LanguageSwitcher.currentLanguage();
// Returns: {"en": "English"} or null if not set

Stocker la langue

Stocker manuellement une preference de langue :

await LanguageSwitcher.storeLanguage(
  object: {"fr": "French"},
);

Effacer la langue

Supprimer la preference de langue stockee :

await LanguageSwitcher.clearLanguage();

Obtenir les donnees de langue

Obtenir les informations de langue a partir d'un code de locale :

Map<String, String>? langData = LanguageSwitcher.getLanguageData("en");
// Returns: {"en": "English"}

Map<String, String>? langData = LanguageSwitcher.getLanguageData("fr_CA");
// Returns: {"fr_CA": "French (Canada)"}

Obtenir la liste des langues

Obtenir toutes les langues disponibles depuis le repertoire /lang :

List<Map<String, String>> languages = await LanguageSwitcher.getLanguageList();
// Returns: [{"en": "English"}, {"es": "Spanish"}, ...]

Afficher le modal en bas de page

Afficher le modal de selection de langue :

await LanguageSwitcher.showBottomModal(context);

// With custom height
await LanguageSwitcher.showBottomModal(context, height: 400);

Locales prises en charge

Le widget LanguageSwitcher prend en charge des centaines de codes de locale avec des noms lisibles. Quelques exemples :

La liste complete inclut des variantes regionales pour la plupart des langues.