web-dev-qa-db-ja.com

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

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

enter image description here

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

dartflutterflutter-web
9
JideGuru

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を更新します。

7
Zerocchi

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

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