Sobes.tech
Middle

Come aggiungere la localizzazione in un'app Flutter?

sobes.tech AI

Risposta dell'AI

  1. Aggiunta delle dipendenze:

    Nel file pubspec.yaml, devi aggiungere le dipendenze per la localizzazione:

    dependencies:
      flutter:
        sdk: flutter
    
      flutter_localizations:
        sdk: flutter
      intl: ^0.18.0 # Versione di esempio, può variare
    

    Poi esegui flutter pub get.

  2. Creazione dei file di localizzazione:

    Crea directory per le risorse di localizzazione, ad esempio ./lib/l10n/. All'interno, crea file .arb per ogni lingua supportata. Per esempio, per inglese e russo:

    app_en.arb:

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

    app_ru.arb:

    {
      "helloWorld": "Привет мир!",
      "@@locale": "ru"
    }
    
  3. Configurazione della generazione del codice:

    Nel file pubspec.yaml, specifica il percorso ai file .arb e configura la generazione:

    flutter:
      generate: true # Attiva la generazione
    
      assets:
        - assets/... # Altri asset
    
      l10n:
        arb-dir: lib/l10n # Directory con i file .arb
        template-arb-file: app_en.arb # File .arb modello
        output-localization-file: app_localizations.dart # Nome del file generato
    

    Dopo aver salvato pubspec.yaml, Flutter genererà automaticamente il file ./lib/generated/l10n.dart (o quello specificato in output-localization-file).

  4. Uso delle stringhe localizzate:

    Nell'app, dove si vogliono usare stringhe localizzate, importa il file generato:

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

    Poi accedi alla stringa localizzata tramite AppLocalizations.of(context)!:

    Text(AppLocalizations.of(context)!.helloWorld),
    
  5. Configurazione di MaterialApp o CupertinoApp:

    Nel widget di livello superiore (solitamente MaterialApp o CupertinoApp) specifica il supporto delle lingue e i delegati di localizzazione:

    import 'package:flutter_gen/gen_l10n/app_localizations.dart';
    
    MaterialApp(
      // ... altre impostazioni
      localizationsDelegates: const [
        AppLocalizations.delegate, // Delegato dal file generato
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: const [
        Locale('en', ''), // Inglese
        Locale('ru', ''), // Russo
        // ... altre lingue supportate
      ],
      // ...
    );
    

Ora l'app selezionerà automaticamente la localizzazione in base alle impostazioni del dispositivo dell'utente, se presente in supportedLocales. Per cambiare manualmente la localizzazione, puoi usare Locale e aggiornare lo stato dell'app.