Sobes.tech
Middle

Comment ajouter la localisation dans une application Flutter?

sobes.tech IA

Réponse de l'IA

  1. Ajout des dépendances:

    Dans le fichier pubspec.yaml, ajoutez les dépendances pour la localisation:

    dependencies:
      flutter:
        sdk: flutter
    
      flutter_localizations:
        sdk: flutter
      intl: ^0.18.0 # Exemple de version, peut varier
    

    Ensuite, exécutez flutter pub get.

  2. Création des fichiers de localisation:

    Créez des répertoires pour les ressources de localisation, par exemple ./lib/l10n/. À l'intérieur, créez des fichiers .arb pour chaque langue supportée. Par exemple, pour l'anglais et le russe:

    app_en.arb:

    {
      "helloWorld": "Hello World!",
      "@@locale": "en"
    }
    

    app_ru.arb:

    {
      "helloWorld": "Привет мир!",
      "@@locale": "ru"
    }
    
  3. Configuration de la génération de code:

    Dans le fichier pubspec.yaml, indiquez le chemin vers les fichiers .arb et configurez la génération:

    flutter:
      generate: true # Activer la génération
    
      assets:
        - assets/... # Vos autres ressources
    
      l10n:
        arb-dir: lib/l10n # Répertoire contenant les fichiers .arb
        template-arb-file: app_en.arb # Fichier .arb modèle
        output-localization-file: app_localizations.dart # Nom du fichier généré
    

    Après avoir sauvegardé pubspec.yaml, Flutter générera automatiquement le fichier ./lib/generated/l10n.dart (ou celui spécifié dans output-localization-file).

  4. Utilisation des chaînes localisées:

    Dans l'application, là où vous souhaitez utiliser des chaînes localisées, importez le fichier généré:

    import 'package:flutter_gen/gen_l10n/app_localizations.dart';
    

    Ensuite, accédez à la chaîne localisée via AppLocalizations.of(context)!:

    Text(AppLocalizations.of(context)!.helloWorld),
    
  5. Configuration de MaterialApp ou CupertinoApp:

    Dans le widget de niveau supérieur (généralement MaterialApp ou CupertinoApp), indiquez le support des langues et les délégués de localisation:

    import 'package:flutter_gen/gen_l10n/app_localizations.dart';
    
    MaterialApp(
      // ... autres configurations
      localizationsDelegates: const [
        AppLocalizations.delegate, // Délégué du fichier généré
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: const [
        Locale('en', ''), // Anglais
        Locale('ru', ''), // Russe
        // ... autres langues supportées
      ],
      // ...
    );
    

L'application choisira automatiquement la localisation en fonction des paramètres de l'appareil de l'utilisateur, si elle est présente dans supportedLocales. Pour changer manuellement la localisation, vous pouvez utiliser Locale et mettre à jour l'état de l'application.