3.1 导入字体

Ramsayi2022-10-312024-01-16

3.1 导入字体

自定义字体，实现步骤：

第 1 步：下载字体文件 ttf otf

一般可以按需下载 google 字体

https://fonts.google.com/

第 2 步：复制文件到你的 fonts 目录

不要所有 ttf 文件全部放入，这会 app 打包文件很大

将设计稿中出现的字体放入 assets/fonts

第 3 步：配置 yaml

pubspec.yaml

fonts:
  - family: Montserrat
    fonts:
      - asset: assets/fonts/Montserrat/Montserrat-Light.ttf
        weight: 300
      - asset: assets/fonts/Montserrat/Montserrat-Regular.ttf
        weight: 400
      - asset: assets/fonts/Montserrat/Montserrat-Medium.ttf
        weight: 500
      - asset: assets/fonts/Montserrat/Montserrat-Bold.ttf
        weight: 700

第 4 步：theme 配置

lib/common/style/theme.dart

/// 主题
class AppTheme {
  /// 亮色
  static ThemeData light = ThemeData(
    colorScheme: lightColorScheme,
    fontFamily: "Montserrat",
  );

  /// 暗色
  static ThemeData dark = ThemeData(
    colorScheme: darkColorScheme,
    fontFamily: "Montserrat",
  );
}