Files

Developer 2b685b45bb Remove notification service and update project

- Remove flutter_local_notifications dependency from pubspec.yaml
- Delete notification_service.dart file
- Remove notification service references from app_service.dart and app_binding.dart
- Clean up related code and dependencies

2026-04-08 10:51:43 +08:00

6.6 KiB

Raw Blame History

个性化设置功能使用指南

🎯 功能概述

已成功为 mom_kitchen 项目创建了一个完整的个性化设置页面，用户可以从个人中心访问并动态调整应用的全局设置。

📱 访问方式

导航路径

个人中心 (Profile Tab) → 设置 → 个性化设置

✨ 功能特性

1. 🎨 主题颜色设置

5种预设颜色：蓝色、橙色、蓝紫、草绿、深红
即时预览：选择颜色后立即应用到整个应用
视觉反馈：选中颜色显示对勾标记
自定义显示：如选择其他颜色，显示"自定义"

2. 📝 字体大小调整

范围：12pt - 24pt（可调节）
实时反馈：滑块显示当前大小
精确控制：以0.5pt为单位调整
全局影响：影响应用所有文本显示

3. 🌙 显示模式（深色模式）

一键切换：开启/关闭深色模式
自动适配：文本和背景色自动调整
系统集成：同步更新状态栏和导航栏颜色

4. ✨ 动画效果强度

范围：0 - 2 倍速
实时调整：滑块操作即时反映
视觉反馈：显示当前强度倍数

5. 🌐 语言设置

支持语言：
- 简体中文 (zh)
- 繁体中文 (zh_Hant)
- English (en)
即时切换：应用界面语言立即更新
持久保存：语言设置已保存到本地存储

6. 🔄 恢复默认设置

一键重置：将所有设置恢复到应用默认值
确认机制：显示确认对话框防止误操作
完全重置：
- 深色模式：关闭
- 主题色：蓝色（#2196F3）
- 字体大小：16pt
- 动画强度：1.0x
- 语言：简体中文

🏗️ 项目结构

新增文件

1. PersonalizationController

位置: lib/src/controllers/personalization_controller.dart

核心功能：

管理所有个性化设置的状态
提供方法调用 ThemeService 和 AnimationService
预设主题颜色和语言列表
实现恢复默认值的逻辑

关键方法：

- setThemeColor(Color color)           // 设置主题颜色
- setFontSize(double size)              // 设置字体大小
- toggleDarkMode()                      // 切换深色模式
- setAnimationIntensity(double)         // 设置动画强度
- setAnimationPreset(AnimationPreset)   // 设置动画预设
- setLanguage(String languageCode)      // 设置语言
- resetToDefaults()                     // 恢复默认值

2. PersonalizationPage

位置: lib/src/pages/personalization_page.dart

UI 层实现：

5个主要设置区域的布局
颜色选择器的可视化实现
滑块和开关控件
语言选择器
恢复默认设置按钮
响应式设计，适配各种屏幕尺寸

🔧 技术实现细节

框架集成

GetX 状态管理
- 使用 GetBuilder 构建 UI
- Obx() 响应式更新
- GetX 路由导航
ThemeService 集成
- 直接调用 ThemeService 方法获得全局效果
- 所有设置自动保存到 SharedPreferences
- 实时更新应用 UI
页面标准遵循
- 继承 BaseController 管理 loading 状态
- 使用 PageStandards 的主题和字体配置
- 集成页面规范验证系统
路由和绑定
- 在 app_routes.dart 中注册新路由 /personalization
- 在 app_binding.dart 中注册控制器
- 在 profile_page.dart 中添加导航

关键集成点

// 1. 路由定义
static const String personalization = '/personalization';

// 2. 页面注册  
GetPage(name: personalization, page: () => const PersonalizationPage(), ...)

// 3. 控制器注册
Get.lazyPut(() => PersonalizationController(), fenix: true);

// 4. 导航
Get.to(() => const PersonalizationPage());

💾 数据持久化

所有设置通过 SharedPreferences 自动保存：

Keys saved:
- is_dark_mode
- primary_color
- secondary_color
- font_size
- animation_intensity
- text_color
- background_color
- locale
- dialog_style
- toast_style

应用重启时会自动恢复用户的设置。

🎨 UI/UX 特点

设计原则

友好提示：每个设置项都有清晰的标签和图标
即时反馈：所有操作立即在页面预览
一致性：UI 风格与现有应用保持一致
无障碍：支持大字体模式

交互反馈

颜色选择时显示对勾标记
数值显示在容器中便于识别
恢复默认设置时有确认对话框
操作完成后显示 Snackbar 通知

🔐 安全性

所有数据保存在本地
没有网络请求
恢复默认不会删除用户数据，只重置设置值
语言切换是无损的

📊 性能优化

使用 Obx() 仅更新受影响的 widget
滑块使用防抖（debounce）避免频繁更新
异步加载和保存操作通过 runWithLoading() 管理
使用 GetBuilder 而非全局 rebuild

🚀 使用建议

第一次启动：应用会加载默认设置
调整设置：即时生效，无需确认
恢复默认：需要在对话框中确认
语言切换：需要重新加载 localization
跨应用：所有设置影响整个应用的所有页面

🐛 已知限制

颜色选择目前仅支持预设颜色，未来可扩展自定义颜色选择器
动画预设与强度独立控制，未来可优化为联动
字体大小调整使用系统默认字体，未来可支持自定义字体

📝 扩展建议

可能的增强功能

自定义颜色选择：使用颜色选择器允许用户选择任意颜色
主题预设：允许保存多个完整的主题配置
导入/导出：支持配置文件的导出和导入
预览模式：在设置前预览完整页面效果
快捷切换：主屏幕添加快速主题切换按钮
更多语言：扩展到更多语言支持

✅ 测试检查清单

已验证的功能：

✅ 导航到个性化设置页面
✅ 主题颜色选择和应用
✅ 字体大小调整
✅ 深色模式切换
✅ 动画强度调整
✅ 语言切换
✅ 恢复默认设置
✅ 设置持久化
✅ 页面响应式设计
✅ 代码规范检查

📞 故障排除

问题：设置不保存

解决：确保 SharedPreferences 已正确初始化，检查 flutter pub get

问题：UI 不更新

解决：确保使用 Obx() 包裹可观察变量，检查 GetBuilder 是否正确绑定

问题：语言不切换

解决：检查 get.updateLocale() 是否被正确调用，验证 localization 资源文件

完成状态: ✅ 功能实现完成并集成到现有框架 最后更新: 2026-04-08

6.6 KiB Raw Blame History Unescape Escape