flutter启动后不显示文字,中文字体不显示

Flutter 3.29.0-1.0.pre.114运行报错:

Failed to load font Roboto at https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Me4GZLCzYlKw.woff2

解决:

下载roboto字体,并将字体(Roboto-Regular.ttf)放入app代码下,配置默认fonts:

Dart 复制代码
flutter:
  uses-material-design: true
  fonts:
    - family: NotoSansSC
      fonts:
        - asset: assets/fonts/NotoSansSC/NotoSansSC-Regular.ttf
    - family: Roboto
      fonts:
        - asset: assets/fonts/Roboto/Roboto-Regular.ttf
          weight: 400
        - asset: assets/fonts/Roboto/Roboto-Medium.ttf
          weight: 500
        - asset: assets/fonts/Roboto/Roboto-Bold.ttf
          weight: 700

flutter运行报错:

Flutter Web engine failed to complete HTTP request to fetch "https://fonts.gstatic.com/s/notosanssc/v37/k3kCo84MPvpLmixcA63oeAL7Iqp5IZJF9bmaG9_FnYkldv7JjxkkgFsFSSOPMOkySAZ73y9ViAt3acb8NexQ2w.116.woff2": TypeError: Failed to fetch

中文字体不显示

解决:

  1. 修改pubspec.yaml,增加NotoSansSC字体配置,并添加字体文件
  2. 修改main.dart设置字体 fontFamily: 'NotoSansSC'
Dart 复制代码
Widget build(BuildContext context) {
    return MaterialApp(
      title: '闹钟应用',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        fontFamily: 'NotoSansSC',
        useMaterial3: true,
      ),
      home: const AlarmListPage(),
    );
  }
相关推荐
J***Q2921 分钟前
前端微前端框架原理,qiankun源码分析
前端·前端框架
菜鸟‍2 分钟前
【前端学习】React学习【万字总结】
前端·学习·react.js
百***84458 分钟前
Webpack、Vite区别知多少?
前端·webpack·node.js
Mintopia13 分钟前
零信任架构下的 WebAIGC 服务安全技术升级方向
前端·人工智能·trae
敏姐的后花园2 小时前
模考倒计时网页版
java·服务器·前端
AiXed3 小时前
PC微信WDA算法
前端·javascript·macos
一只小阿乐8 小时前
react 封装弹框组件 传递数据
前端·javascript·react.js
533_9 小时前
[element-plus] el-tree 动态增加节点,删除节点
前端·javascript·vue.js
禁止摆烂_才浅9 小时前
前端开发小技巧-【JavaScript】- 获取元素距离 document 顶部的距离
前端·javascript·react.js
wshzd9 小时前
LLM之Agent(二十九)|LangChain 1.0核心组件介绍
前端·javascript·langchain