Flutter之添加字体及设置主题字体

创建fonts文件夹

在项目文件下创建一个fonts文件夹:

下载字体

我是从 Google Fonts 下载的字体

导入字体

 将下载的字体全部放到刚才新建的文件夹中:

声明字体

在 pubspec.yaml 中声明字体:

fonts:
    - family: notoSancsSC
      fonts:
        - asset: fonts/NotoSansSC-Black.otf
        - asset: fonts/NotoSansSC-Bold.otf
        - asset: fonts/NotoSansSC-Light.otf
        - asset: fonts/NotoSansSC-Medium.otf
        - asset: fonts/NotoSansSC-Regular.otf
        - asset: fonts/NotoSansSC-Thin.otf
          style: italic

family 属性决定了字体的名称,你将会在 TextStyle 的 fontFamily 属性中用到。

asset 是字体文件对于 pubspec.yaml 文件的相对路径。这些文件包含了字体中字形的轮廓。构建应用时,这些文件将会被包含在应用程序的资源包中。

单个字体可以引用多个不同轮廓字重及风格的文件:

  • weight 属性指定了文件中字体轮廓的字重为 100 的整数倍,并且范围在 100 和 900 之间。这些值对应 FontWeight 并能够在 TextStyle 对象的 fontWeight 属性上使用。例如,如果你想使用上面定义的 RobotoMono-Bold 字体,你可以在 TextStyle 中将 fontWeight 设置为 FontWeight.w700

    需要注意的是,定义 weight 属性不会覆盖字体的实际粗细。你无法使用 FontWeight.w100 访问 RobotoMono-Bold,即使其 weight 设置为了 100。

  • style 属性指定文件中字体的轮廓是否为 italic 或 normal。这些值对应 FontStyle 并能够在 TextStyle 对象的 fontStyle 属性上使用。例如,如果你想使用上面定义的 Raleway-Italic 字体,你可以在 TextStyle 中将 fontStyle 设置为 FontStyle.italic

    需要注意的是,定义 style 属性不会更改字体的实际样式;你无法使用 FontStyle.normal 访问 Raleway-Italic,即使其 style` 设置为了 normal。

使用实例

Text(taskInfo[index].content!,style: TextStyle(fontFamily: "notoSancsSC",),)

 设置默认字体

如果想要设为默认字体,请将 fontFamily 设为应用(全局)theme 的属性的一部分。提供的 fontFamily 的值必须与 pubspec.yaml 中声明的名称相匹配。

return MaterialApp(
  title: 'Custom Fonts',
  // Set Raleway as the default app font.
  theme: ThemeData(fontFamily: 'Raleway'),
  home: const MyHomePage(),
);

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值