如何更改Flutter for Web Font?

时间:2019-07-13 23:03:27

标签: flutter flutter-web

我试图在Flutter for Web Application中更改标题的字体,我该怎么做?我发现pubsec.yaml与移动版本完全不同,这里是文件:

name: projectbaseclient
description: An app built using Flutter for web

environment:
  # You must be using Flutter >=1.5.0 or Dart >=2.3.0
  sdk: '>=2.3.0 <3.0.0'

dependencies:
  flutter_web: any
  flutter_web_ui: any

dev_dependencies:
  build_runner: ^1.5.0
  build_web_compilers: ^2.1.0
  pedantic: ^1.7.0

dependency_overrides:
  flutter_web:
    git:
      url: https://github.com/flutter/flutter_web
      path: packages/flutter_web
  flutter_web_ui:
    git:
      url: https://github.com/flutter/flutter_web
      path: packages/flutter_web_ui

这是FontManifest.json:

[
    {
      "family": "Poppins",
      "fonts": [
        {
          "asset": "fonts/Poppins-Regular.ttf"
        }
      ]
    },
    {
      "family": "KronaOne",
      "fonts": [
        {
          "asset": "fonts/KronaOne-Regular.ttf"
        }
      ]
    },
    {
      "family": "Ubuntu",
      "fonts": [
        {
          "asset": "fonts/Ubuntu-Regular.ttf"
        }
      ]
    }
  ]

我已经创建了一个文件夹asset / fonts,并在该文件夹中添加了字体,我也创建了FontManifest.json并将其放在assets文件夹中,但是它的代码无法正常工作,当我更改fontFamily参数时它给了我错误在Text对象中。

如何在Flutter for Web项目中使用字体?

1 个答案:

答案 0 :(得分:2)

检查assets文件夹是否位于web文件夹中,然后将FontManifest.json的内容与以下示例进行比较:

[
  {
    "family": "Rubik",
    "fonts": [
      {
        "asset": "fonts/Rubik-Regular.ttf"
      },
      {
        "asset": "fonts/Rubik-Medium.ttf",
        "weght": 500
      }
    ]
  }
]