web-dev-qa-db-ja.com

Flutterの文字列xmlファイル

フラッターでは、文字列は次のようにTextFieldウィジェットに直接設定されます。

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

正しい方法ですか?または、1つのファイルにすべての文字列を保持し、次のように使用できます。

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

出来ますか ?

23
Magesh Pandian

Flutterには現在、文字列専用のリソースのようなシステムはありません。現時点では、クラスのコピーテキストを静的フィールドとして保持し、そこからアクセスすることをお勧めします。例えば:

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

次に、コードで、次のように文字列にアクセスできます。

Text(Strings.welcomeMessage)

ソース


19年5月編集:

このパッケージ が追加されました。これにより、ストリングを使用してjsonファイルを作成できます。複数形、性別、言語などの文字列を作成できます

次のように、言語ごとに個別のjsonファイルを作成できます。

string_en.json

{
"thanks": "Thanks."
}

string_nl.json

{    
"thanks": "Dankjewel."
}

これを使用してアクセスします

S.of(context).thanks;

それはあなたの電話のデフォルト言語に基づいて選択する言語を知っています。

24
MSpeed

enter image description here

サードパーティのプラグインを使用したくない場合は、次の方法で実行できます。

  1. stringsassetsフォルダーを作成します。言語ファイルを入れてください。

    assets
      strings
      - en.json // for english 
      - ru.json  // for russian
    
  2. en.jsonに、たとえば文字列を記述します。

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

    同様に、ru.jsonでは

    {
      "text1": "Привет",
      "text2": "Мир"
    }
    
  3. これをpubspec.yamlファイルに追加(スペースに注意)

    flutter:
    
      uses-material-design: true
    
      assets:
        - assets/strings/en.json
        - assets/strings/ru.json
    
  4. これで、アプリでこれらの文字列を使用する準備がすべて整いました。これがサンプルコードです。AppBarは翻訳されたテキストを示します。

    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

ドキュメントの国際化セクションに示されているメソッドを使用して、集中型の文字列管理と翻訳(翻訳が必要な場合)の両方を制御できます。

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

ただし、文字列が少ししかない単純なアプリの場合は、やりすぎかもしれません。

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

それが正しい方法です。フラッターでは必要ありません.xmlまたは.cssレイアウト/ものを管理するためのファイル。

すべてはDartコードを使用して管理されます。これにより、すべてがはるかに簡単になります。

0
Rémi Rousselet