web-dev-qa-db-fra.com

Fichier xml de chaîne dans Flutter

Dans la chaîne de flutter, le texte est directement défini sur le widget TextField comme:

new Text('Hello,  How are you?')

Est-ce la bonne façon? ou nous pouvons conserver toutes les chaînes dans un seul fichier et les utiliser comme:

<string name="name_hint">Hello, How are you?</string>

C'est possible ?

androiddartresourcesflutter
23
Magesh Pandian

Flutter n'a actuellement pas de système dédié aux ressources, semblable à des ressources. À l'heure actuelle, la meilleure pratique consiste à conserver votre texte de copie dans une classe en tant que champs statiques et à y accéder à partir de là. Par exemple:

class Strings {
  static const String welcomeMessage = "Welcome To Flutter";
}

Ensuite, dans votre code, vous pouvez accéder à vos chaînes en tant que telles:

Text(Strings.welcomeMessage)

source

Modifier mai '19:

Il y a maintenant ce package qui vous permet de créer des fichiers json avec vos chaînes. Il vous permettra de créer des chaînes pour les pluriels, les genres et les langues, etc.

Vous pouvez créer un fichier json distinct pour chaque langue comme ceci:

string_en.json

{
"thanks": "Thanks."
}

string_nl.json

{    
"thanks": "Dankjewel."
}

Et puis utilisez-le pour y accéder

S.of(context).thanks;

Il saura quelle langue choisir en fonction de la langue par défaut de votre téléphone.

24
MSpeed

enter image description here

Pour ceux d'entre vous qui ne veulent pas utiliser de plugin tiers, voici comment vous pouvez le faire.

  1. Créez un dossier strings dans assets. Mettez-y votre fichier de langue.

    assets
  strings
  - en.json // for english 
  - ru.json  // for russian

  2. Maintenant en en.json, écrivez votre chaîne, par exemple.

    {
  "text1": "Hello",
  "text2": "World"
}

    De même, dans ru.json,

    {
  "text1": "Привет",
  "text2": "Мир"
}

  3. Ajoutez ceci à pubspec.yaml fichier (attention aux espaces)

    flutter:

  uses-material-design: true

  assets:
    - assets/strings/en.json
    - assets/strings/ru.json

  4. Vous êtes maintenant prêt à utiliser ces chaînes dans votre application. Voici l'exemple de code, le AppBar montre le texte traduit.

    void main() {
  runApp(
    MaterialApp(
      locale: Locale("ru"), // switch between en and ru to see effect
      localizationsDelegates: [const DemoLocalizationsDelegate()],
      supportedLocales: [const Locale('en', ''), const Locale('ru', '')],
      home: HomePage(),
    ),
  );
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(DemoLocalizations.of(context).getText("text2") ?? "Error")),
    );
  }
}

// this class is used for localizations
class DemoLocalizations {
  static DemoLocalizations of(BuildContext context) {
    return Localizations.of<DemoLocalizations>(context, DemoLocalizations);
  }

  String getText(String key) => language[key];
}

Map<String, dynamic> language;

class DemoLocalizationsDelegate extends LocalizationsDelegate<DemoLocalizations> {
  const DemoLocalizationsDelegate();

  @override
  bool isSupported(Locale locale) => ['en', 'ru'].contains(locale.languageCode);

  @override
  Future<DemoLocalizations> load(Locale locale) async {
    String string = await rootBundle.loadString("assets/strings/${locale.languageCode}.json");
    language = json.decode(string);
    return SynchronousFuture<DemoLocalizations>(DemoLocalizations());
  }

  @override
  bool shouldReload(DemoLocalizationsDelegate old) => false;
}
7
CopsOnRoad

Vous pouvez utiliser les méthodes représentées dans les sections d'internationalisation de la documentation pour contrôler à la fois la gestion centralisée des chaînes et les traductions (si vous avez besoin de traductions)

https://flutter.io/tutorials/internationalization/

Cela peut être exagéré pour une application simple avec seulement quelques chaînes.

3
Jason Smith
  create "Strings.Dart" file and add the below line==>


 class Strings
 {
      static String welcomeScreen="WelCome Page";
      static String loadingMessage="Loading Please Wait...!";
 }

 And then call the file using the below line using the widget
 Text(Strings.loadingMessage)

 Make sure that the String.Dart file has been imported
0
jebran

C'est la bonne façon. Dans le flottement, vous n'avez pas besoin de .xml ou .css fichiers pour gérer votre mise en page/trucs.

Tout est géré en utilisant le code Dart. Ce qui rend tout beaucoup plus facile.

0
Rémi Rousselet