【问题标题】:In Flutter on adding custom font, FontWeight is not affecting the text在 Flutter 中添加自定义字体,FontWeight 不影响文本
【发布时间】:2021-02-10 14:50:18
【问题描述】:

image pubspec 我想将 Noir Pro 设置为我的 Flutter 应用的默认字体系列。

默认 Roboto fontFamily 更改为 NoirPro,但字体粗细 e.g(.w400,w500,w600) 无法正常工作。我找不到任何其他在线帮助。这让我很沮丧

pubspec.yaml

fonts:
    - family: NoirPro
      fonts:
        - asset: resources/fonts/NoirPro_Light.ttf
          weight: 300
        - asset: resources/fonts/NoirPro_Normal.ttf
          weight: 400
        - asset: resources/fonts/NoirPro_Medium.ttf
          weight: 500
        - asset: resources/fonts/NoirPro_Bold.ttf
          weight: 700
        - asset: resources/fonts/NoirPro_Heavy.ttf
          weight: 800

In main.dart

 theme: ThemeData(
          fontFamily: 'NoirPro',
          canvasColor: Colors.white,
        ),

【问题讨论】:

    标签: flutter dart font-family


    【解决方案1】:

    我找到了原因,而且很简单:

    Flutter 根据字体本身的元数据匹配一个家族中的字体,而不是 pubspec.yaml 中声明的样式描述符。

    我的 NoirPro、中号和粗体字体包含元数据,将它们的权重分别声明为 400、410 和 420。但是,Flutter 文本子系统仅支持表示 100 的偶数倍数的字体权重桶 (https://api.flutter.dev/flutter/dart-ui/FontWeight-class.html)。所以这三种字体都映射到FontWeight.w400,字体样式匹配器无法根据粗细在这些字体之间进行选择。

    (您可以使用此站点检查字体文件的元数据:https://fontdrop.info/

    在 pubspec.yaml 中将这些字体声明为不同的系列将解决此问题。

    当前请求的权重是根据字体本身定义的权重元数据选择的。 pubspec.yaml 中的权重被忽略。

    应更新文档(食谱)以反映这一点,以免混淆其他开发人员。 现在我的 pubspec.yaml 是:

    fonts:
    - family: NoirProNormal
      fonts:
        - asset: resources/fonts/NoirPro_Normal.ttf
    - family: NoirProLight
      fonts:
        - asset: resources/fonts/NoirPro_Light.ttf
    - family: NoirProMedium
      fonts:
        - asset: resources/fonts/NoirPro_Medium.ttf
    - family: NoirProBold
      fonts:
        - asset: resources/fonts/NoirPro_Bold.ttf
    - family: NoirProHeavy
      fonts:
        - asset: resources/fonts/NoirPro_Heavy.ttf
    

    当使用文本小部件时:

    Text(
            "Hello World",
            style: TextStyle(
                fontSize: size.width * 0.075,
                fontFamily: "NoirProMedium",
                color: Colors.white)
          ),
    

    【讨论】:

    • 啊,这很有趣。谢谢指出!
    【解决方案2】:

    尝试定义不带空格的姓氏

    - family: NoirPro
    

    【讨论】:

    • 这个我已经试过了,但是这样也行不通
    【解决方案3】:

    尝试在没有空格的情况下定义 - family: NoirPro 并且您还需要在文本小部件中提供所需的权重

    Text(
        "Hello",
        style: TextStyle(
            fontWeight: FontWeight.w400
        ),
    )
    

    【讨论】:

    • 我已经这样做了,尝试了没有空格的姓氏,当然我在 Text 小部件中提供了字体粗细。问题是它要么将字体权重设置为常规或粗体,而不是其他权重
    猜你喜欢
    • 2019-05-10
    • 1970-01-01
    • 2019-12-12
    • 2021-05-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-24
    • 2016-07-12
    相关资源
    最近更新 更多