4.2 KiB
4.2 KiB
🎨 Google Fonts (Nunito) - 实现总结
日期: 2025-11-22 状态: ✅ 95% 完成(需要清理const关键字)
✅ 已完成
1. 添加 Google Fonts 依赖
dependencies:
google_fonts: ^6.1.0 # Google Fonts (Nunito)
✅ 已安装并可用
2. 更新主题文件
- ✅
app_text_styles.dart- 所有样式使用GoogleFonts.nunito() - ✅
app_theme.dart- 默认字体族使用 Google Fonts
3. 优点
- 自动从 Google 服务器下载字体
- 无需手动管理字体文件
- 支持所有字重(Light, Regular, SemiBold, Bold, ExtraBold)
- 跨平台一致性
⚠️ 待修复
编译错误:const 关键字冲突
问题:Google Fonts 返回的 TextStyle 不是 const,但代码中使用了 const Text(...style: AppTextStyles...)
错误示例:
const Text(
'FocusBuddy',
style: AppTextStyles.appTitle, // ❌ appTitle 不是 const
)
修复方法:删除 const 关键字
Text(
'FocusBuddy',
style: AppTextStyles.appTitle, // ✅ 正确
)
需要修复的文件和行数
根据编译器输出,以下位置仍需修复:
home_screen.dart
- 第 49 行 -
const Text('FocusBuddy', style: AppTextStyles.appTitle) - 第 115 行 -
const Text("Tap 'I got distracted'...", style: AppTextStyles.helperText)
history_screen.dart
- 第 86 行 -
const Text('No focus sessions yet', style: AppTextStyles.headline) - 第 92 行 -
const Text('Start your first session...', style: AppTextStyles.helperText)
settings_screen.dart
- 第 63 行 -
const Padding(...child: Text(...style: AppTextStyles.bodyText)) - 第 84 行 -
title: const Text('Privacy Policy', style: AppTextStyles.bodyText) - 第 100 行 -
title: const Text('About FocusBuddy', style: AppTextStyles.bodyText) - 第 251 行 -
content: const SingleChildScrollView(...style: AppTextStyles.bodyText) - 第 276 行 -
content: const SingleChildScrollView(...style: AppTextStyles.bodyText)
complete_screen.dart
- 第 46 行 -
const Text('You focused for', style: AppTextStyles.headline)
🛠️ 快速修复脚本
手动修复步骤
- 打开每个文件
- 搜索
const Text(或const Padding( - 如果该 Widget 使用了
AppTextStyles.*,删除const关键字 - 保存文件
或使用正则表达式查找替换(VSCode)
查找:
const (Text|Padding)\(([^)]*style: AppTextStyles\.)
替换:
$1($2
🎯 测试方法
修复完成后:
# 1. 清理构建缓存
flutter clean
# 2. 重新获取依赖
flutter pub get
# 3. 运行应用
flutter run -d edge
# 4. 验证字体加载
# 打开浏览器开发者工具(F12)
# 在 Network 标签查看是否有 Nunito 字体请求
📊 字体配置详情
使用的字体变体
| 字重 | 用途 | 代码位置 |
|---|---|---|
| Light (300) | Helper text | helperText |
| Regular (400) | Body text, quotes | bodyText, encouragementQuote |
| SemiBold (600) | Headlines, buttons | headline, buttonText |
| Bold (700) | App title, large numbers | appTitle, largeNumber |
| ExtraBold (800) | Timer display | timerDisplay |
Google Fonts CDN
字体自动从以下来源加载:
https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800
首次加载后会缓存到本地,后续离线也可用。
🚀 完成清单
- 添加 google_fonts 依赖
- 更新 app_text_styles.dart
- 更新 app_theme.dart
- 删除所有const关键字(剩余10处)
- 测试字体渲染
- 验证所有字重正确显示
💡 备用方案
如果 Google Fonts 在某些环境无法使用:
方案 A: 手动下载字体
- 从 Google Fonts 下载 Nunito
- 放到
assets/fonts/目录 - 在 pubspec.yaml 配置
- 回退到硬编码
fontFamily: 'Nunito'
方案 B: 使用系统字体
- 删除所有
fontFamily设置 - 依赖系统默认字体
- 跨平台一致性降低,但功能正常
📝 当前状态
Google Fonts 集成: ████████░░ 95%
剩余工作:删除 10 处 const 关键字(约5分钟)
预期完成时间:今天
文档版本: 1.0 最后更新: 2025-11-22