Flutter Web未显示“材料设计”图标

Question

我启动了Flutter Web，我想将图标添加到Flutter Web应用程序中，但改为显示框。

欢迎任何帮助。谢谢

Answer 1

根据此， 您可以直接将Material图标添加到FontManifest.json，如下所示。

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

Answer 2

从flutter_web存储库：

注意：MaterialIcons故意省略对它的引用，因为此源中未包含相应的字体。

如果添加MaterialIcons-Extended.ttf到此目录，则可以更新FontManifest.json如下：

[
  {
    "family": "MaterialIcons",
    "fonts": [
      {
        "asset": "MaterialIcons-Extended.ttf"
      }
    ]
  },
  {
    "family": "GoogleSans",
    "fonts": [
      {
        "asset": "GoogleSans-Regular.ttf"
      }
    ]
  },
  {
    "family": "GalleryIcons",
    "fonts": [
      {
        "asset": "GalleryIcons.ttf"
      }
    ]
  }
]

解决方案/解决方法

MaterialIcons-Regular.ttf 在此处下载，将其放在您的assets文件夹中，然后进行相应更新FontManifest.json。