dart - Flutter Web でマテリアル デザイン アイコンが表示されない

Question

Flutter webFlutter Web アプリに Material アイコンを追加したかったのですが、代わりにボックスを表示していました。

どんな助けでも大歓迎です。ありがとう

Answer 1

これによると、FontManifest.json以下に示すよう にマテリアルアイコンを直接追加できます。

[
  {
    "family": "MaterialIcons",
    "fonts": [
      {
        "asset": "https://fonts.gstatic.com/s/materialicons/v42/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2"
      }
    ]
  }
]

Answer 2

これで問題は解決しました。Web 出力をビルドした後、フォルダー build/web/assets/fonts を調べます。次の名前のファイルがある場合: MaterialIcons-Regular. otf次に、これを pubspec.yaml に追加します。

- family: MaterialIcons
  fonts:
    - asset: fonts/MaterialIcons-Regular.otf

および FontManifest.json (パス web/assets/FontManifest.json 内):

{
"family": "MaterialIcons",
"fonts": [
  {
    "asset": "fonts/MaterialIcons-Regular.otf"
  }
]

}

フォントファイルのフォーマットに注意してください。ttfではなくotfです