看官方的stocks源碼赃承，發(fā)現(xiàn)有國際化的部分，這塊不知道怎么弄赘被，因此就各種地方查找資料是整。資料都是正確的，但是就是能對于小白來說比較難懂民假，因此浮入，寫篇博客詳細(xì)記錄如何用intl制作國際化文件。

工具

• vsCode

步驟以及解釋

1 打開vsCode
2 點擊view->command-palette...

3 選擇flutter:new project

4 給工程起個名字 intl_name( 工程名字不支持大寫) 回車羊异，保存文件到相關(guān)目錄下

目前工程結(jié)構(gòu)如圖

5 添加intl 依賴包

打開pubspec.yaml 文件事秀，添加代碼如下,并save下，這時候vscode會加載這兩個依賴包

 intl: 0.15.7
  intl_translation: 0.17.3

• 這里intl的版本查找我們可以在這個網(wǎng)址查找

image.png

6 創(chuàng)建一個需要本地化的dart文件野舶，這里我在lib目錄下創(chuàng)建名字問stock_string.dart文件 和 intl文件夾（該文件保存我們需要的dart轉(zhuǎn)換成的art文件）

image.png

• 該文件下還沒有本地化的字符串

7 轉(zhuǎn)換 stock_string.dart 文件到art文件.

• 打開vscode的控制臺易迹，找到命令行

  
  
• 輸入命令

$:flutter pub pub run intl_translation:extract_to_arb --output-dir=lib/intl lib/stock_string.dart 

• --output-dir=lib/intl 指定我們將dart 文件輸出到那個文件夾下
• lib/stock_string.dart 該位置是說我們需要將這個dart文件轉(zhuǎn)換成art文件

該命令執(zhí)行結(jié)束后會在intl文件夾下生成一個intl_messages.arb文件
該文件中只有下列數(shù)據(jù)

{
  "@@last_modified": "2019-03-21T16:49:24.250876"
}

image.png

8 在stock_string.dart文件中添加需要國際化的數(shù)據(jù)，并save下該文件

import 'package:intl/intl.dart';

class StockStrings {
  String title() {
    return Intl.message(
      '<Stocks>',
      name: 'title',
      desc: 'Title for the Stocks application',
      locale: "_localeName",
    );
  }

  String market() => Intl.message(
    'MARKET',
    name: 'market',
    desc: 'Label for the Market tab',
    locale: "_localeName",
  );

  String portfolio() => Intl.message(
    'PORTFOLIO',
    name: 'portfolio',
    desc: 'Label for the Portfolio tab',
    locale: "_localeName",
  );
}

image.png

9 重新運行命令flutter pub pub run intl_translation:extract_to_arb --output-dir=lib/intl lib/stock_string.dart查看intl_messages.arb文件

image.png

+這個時候我們看intl_messages.arb 中有本地化文件了

• 這里需要說明下平道，intl_messages.arb 全部來自stock_string.dart 文件中Intl.message()函數(shù)下的字符串

10 將art文件轉(zhuǎn)換成dart文件.在終端運行命令

flutter pub pub run intl_translation:generate_from_arb --output-dir=lib/intl --generated-file-prefix=stock_ --no-use-deferred-loading lib/*dart lib/intl/*.arb  

這個時候在intl文件夾下生成兩個文件睹欲，stock_messages_all.dart 和stock_messages_messages.dart

• --output-dir=lib/intl 將arb 轉(zhuǎn)換成dart 代碼路徑
• --generated-file-prefix=stock_ 生成文件的前綴，也可以不加
• lib/intl/*.arb 需要轉(zhuǎn)換的arb文件路徑

這時候控制臺會有個信息

No @@locale or _locale field found in intl_messages, assuming 'messages' based on the file name.

這是因為我們在生成的intl_messages文件中一屋，json中沒有@@locale key

• intl_messages 其實就是個模板文件窘疮。供生成其他語言copy使用的

11假設(shè)我們需要生成en 語言，我們直接將intl_messages.arb文件改成stock_en.arb文件冀墨，在該文件中加入@@locale 字段闸衫，消除警告。再重新運行上述命令

{
  "@@last_modified": "2019-03-21T16:56:39.952170",
  "@@locale":"en",
  "title": "<Stocks>",
  "@title": {
    "description": "Title for the Stocks application",
    "type": "text",
    "placeholders": {}
  },
  "market": "MARKET",
  "@market": {
    "description": "Label for the Market tab",
    "type": "text",
    "placeholders": {}
  },
  "portfolio": "PORTFOLIO",
  "@portfolio": {
    "description": "Label for the Portfolio tab",
    "type": "text",
    "placeholders": {}
  }
}

這個時候在intl 文件夾下生成了文件stock_messages_en.dart文件诽嘉，與stocks_en.arb 文件對應(yīng)蔚出。其實這里的stock_messages_messages文件可以刪除了疫蔓。

參考文章