Question

我知道如何在应用程序中添加自定义字体。但是weight和style中的混乱。

例如。

如果我在应用程序中添加Montserrat字体，并且在我应用程序的资产文件夹中只有 Montserrat-Regular.ttf ，则在我写的pubspec.yaml 文件。

 fonts:
    - family: Montserrat
      fonts:
        - asset: asset/fonts/Montserrat-Regular.ttf

在Text小部件中，我使用了所有3种正常，粗体和斜体，并且可以正常工作！！

Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'This is normal font',
              style: TextStyle(
                fontFamily: 'Montserrat',
              ),
            ),
            SizedBox(height: 10),
            Text(
              'This is bold font',
              style: TextStyle(
                fontFamily: 'Montserrat',
                fontWeight: FontWeight.bold
              ),
            ),
            SizedBox(height: 10),
            Text(
              'This is italic font',
              style: TextStyle(
                  fontFamily: 'Montserrat',
                fontStyle: FontStyle.italic
              ),
            ),
          ],
        )

因此，如果常规字体适用于粗体和斜体，那么在Match Phrase Prefix Query为什么添加

flutter:
  fonts:
    - family: Raleway
      fonts:
        - asset: fonts/Raleway-Regular.ttf
        - asset: fonts/Raleway-Italic.ttf
          style: italic
    - family: RobotoMono
      fonts:
        - asset: fonts/RobotoMono-Regular.ttf
        - asset: fonts/RobotoMono-Bold.ttf
          weight: 700

Raleway-Italic.ttf 和 RobotoMono-Bold.ttf 吗？???他们应该只在资产中添加常规字体，我认为这可以工作吗？

还有我上面的代码中的另一件事。如果我设置

第一个文本“ fontWeight：FontWeight.w300”
第二个文本“ fontWeight：FontWeight.w500”

我找不到任何区别。

OR

如果我设置

第一个文本“ fontWeight：FontWeight.w600”
第二个文本“ fontWeight：FontWeight.w900”

我找不到任何区别。

为什么，有人会解释我。

Answer 1

如果您的字体带有变体（斜体或粗体/中等的不同字体），则可以在同一字体家族中对其进行定义：

  fonts:
    - family: Roboto
      fonts:
        - asset: assets/fonts/roboto/Roboto-Black.ttf
          weight: 900
        - asset: assets/fonts/roboto/Roboto-BlackItalic.ttf
          style: italic
          weight: 900
        - asset: assets/fonts/roboto/Roboto-Bold.ttf
          weight: 700
        - asset: assets/fonts/roboto/Roboto-BoldItalic.ttf
          style: italic
          weight: 700
        - asset: assets/fonts/roboto/Roboto-Italic.ttf
          style: italic
        - asset: assets/fonts/roboto/Roboto-Light.ttf
          weight: 300
        - asset: assets/fonts/roboto/Roboto-LightItalic.ttf
          style: italic
          weight: 300
        - asset: assets/fonts/roboto/Roboto-Medium.ttf
          weight: 500
        - asset: assets/fonts/roboto/Roboto-MediumItalic.ttf
          style: italic
          weight: 500
        - asset: assets/fonts/roboto/Roboto-Regular.ttf
        - asset: assets/fonts/roboto/Roboto-Thin.ttf
          weight: 100
        - asset: assets/fonts/roboto/Roboto-ThinItalic.ttf
          style: italic
          weight: 100

以我的Roboto为例：

如果您使用Roboto字体系列和具有默认粗细的文本，它将使用Roboto-Regular.ttf

但是，如果您使用斜体样式，它将使用Roboto-Italic.ttf

我对粗体，中号，薄型和每种斜体字都有不同的版本。

与软件样式的字体相比，它使字体更加优美……

在pubspec.yaml文件中，您拥有fonts，可以有一个或多个孩子- family，可以有一个或多个孩子fonts（对于与在CSS font-family: Arial, Helvetica, sans-serif;中起作用的方式。

fonts可以有一个或多个- asset的孩子，也可以有weight和/或style作为孩子或没有孩子。

Answer 2

我有同样的问题。 Flutter甚至不需要斜体.otf即可呈现斜体样式的文本。这非常令人困惑。所以我花了一些时间进行一个小实验：

由蒙特塞拉特（Montserrat）48pt超轻正常产生的颤振斜体文本 V.S.蒙特塞拉特48pt Extra-Light italic.otf文本

它们看起来不一样！结果表明Flutter可以从当前使用的任何字体自动生成一些“斜体”文本。但这不一定与设计人员创建的实际斜体字体文件相同。

在Flutter应用中添加自定义字体的困惑

2 个答案: