From 9625d3388fb1a6fb519977e9a92eecd896db5f37 Mon Sep 17 00:00:00 2001 From: sion123 <450702724@qq.com> Date: Sat, 28 Mar 2026 18:17:20 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- flutter_monisuo/specs/modernization-v2.md | 461 ------------------- flutter_monisuo/specs/theme-design.md | 237 ---------- flutter_monisuo/specs/theme-modernization.md | 209 --------- 3 files changed, 907 deletions(-) delete mode 100644 flutter_monisuo/specs/modernization-v2.md delete mode 100644 flutter_monisuo/specs/theme-design.md delete mode 100644 flutter_monisuo/specs/theme-modernization.md diff --git a/flutter_monisuo/specs/modernization-v2.md b/flutter_monisuo/specs/modernization-v2.md deleted file mode 100644 index f339e0e..0000000 --- a/flutter_monisuo/specs/modernization-v2.md +++ /dev/null @@ -1,461 +0,0 @@ -# Flutter Monisuo 现代化改造规范 v2.0 - -## 目标 -将 Flutter Monisuo 应用打造为现代化、简约、专业的虚拟货币交易平台，参考 SuperDesign 设计原则。 - -## 设计原则 - -### 1. 现代化简约风格 -- **Vercel/Linear 风格**：干净的深色主题，微妙的阴影，大量留白 -- **避免过时设计**：不使用 Bootstrap 蓝、沉重的阴影、复杂的渐变 -- **微交互**：细腻的动画反馈（150-400ms） - -### 2. 明暗主题支持 -- 完整的 Light/Dark 主题切换 -- 使用 ColorScheme 管理主题 -- 主题切换时平滑过渡 - -### 3. 颜色系统（基于 OKLCH 转换） - -#### 现代深色主题 -```dart -// Vercel/Linear 风格 -background: Color(0xFF0A0A0B) // oklch(0.098 0.005 270) -cardBackground: Color(0xFF111113) // oklch(0.148 0.004 270) -primary: Color(0xFF00D4AA) // 品牌青绿色 -primaryForeground: Color(0xFFFFFFFF) -secondary: Color(0xFF1C1C1F) -muted: Color(0xFF27272A) -border: Color(0xFF27272A) -``` - -#### 现代浅色主题 -```dart -background: Color(0xFFFFFFFF) // oklch(1 0 0) -cardBackground: Color(0xFFFAFAFA) // oklch(0.98 0 0) -primary: Color(0xFF00B894) // 品牌青绿色（深色版） -primaryForeground: Color(0xFFFFFFFF) -secondary: Color(0xFFF4F4F5) -muted: Color(0xFFE4E4E7) -border: Color(0xFFE4E4E7) -``` - -#### 涨跌色（明暗通用） -```dart -up: Color(0xFF00C853) // 涨/买入（绿色） -down: Color(0xFFFF5252) // 跌/卖出（红色） -``` - -### 4. 字体系统 - -#### 使用 Google Fonts -```yaml -dependencies: - google_fonts: ^6.1.0 -``` - -#### 字体选择 -- **主字体**：Inter（现代、清晰） -- **数字字体**：JetBrains Mono（等宽，用于价格/数量） -- **回退字体**：system-ui - -#### 字号系统 -```dart -// 标题 -displayLarge: 32sp, weight: 700 -displayMedium: 24sp, weight: 600 -displaySmall: 20sp, weight: 600 - -// 正文 -bodyLarge: 16sp, weight: 400 -bodyMedium: 14sp, weight: 400 -bodySmall: 12sp, weight: 400 - -// 数字（等宽） -numberLarge: 20sp, JetBrains Mono -numberMedium: 16sp, JetBrains Mono -numberSmall: 14sp, JetBrains Mono -``` - -### 5. 间距系统 - -```dart -class Spacing { - static const double xs = 4.0; // 0.25rem - static const double sm = 8.0; // 0.5rem - static const double md = 16.0; // 1rem - static const double lg = 24.0; // 1.5rem - static const double xl = 32.0; // 2rem - static const double xxl = 48.0; // 3rem -} -``` - -### 6. 圆角系统 - -```dart -class BorderRadius { - static const double sm = 4.0; - static const double md = 8.0; - static const double lg = 12.0; - static const double xl = 16.0; - static const double xxl = 24.0; - static const double full = 9999.0; -} -``` - -### 7. 阴影系统 - -```dart -// 微妙的阴影（Vercel 风格） -BoxShadow( - color: Colors.black.withOpacity(0.05), - blurRadius: 4, - offset: Offset(0, 2), -) - -// 悬停阴影 -BoxShadow( - color: Colors.black.withOpacity(0.1), - blurRadius: 8, - offset: Offset(0, 4), -) -``` - -### 8. 动画系统 - -```dart -class AnimationDurations { - static const Duration fast = Duration(milliseconds: 150); - static const Duration normal = Duration(milliseconds: 250); - static const Duration slow = Duration(milliseconds: 400); - static const Duration verySlow = Duration(milliseconds: 600); -} - -// Curves -Curves.easeOutCubic // 入场动画 -Curves.easeInOutCubic // 过渡动画 -Curves.elasticOut // 弹性反馈 -``` - -## 组件设计规范 - -### 1. 按钮 - -#### 主要按钮（Primary） -```dart -ElevatedButton( - style: ElevatedButton.styleFrom( - backgroundColor: Theme.of(context).colorScheme.primary, - foregroundColor: Theme.of(context).colorScheme.onPrimary, - minimumSize: Size(44, 44), // 触摸目标 - padding: EdgeInsets.symmetric(horizontal: Spacing.lg, vertical: Spacing.md), - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(BorderRadius.md), - ), - elevation: 0, // 现代风格：无阴影或微阴影 - ), -) -``` - -#### 次要按钮（Secondary） -```dart -OutlinedButton( - style: OutlinedButton.styleFrom( - minimumSize: Size(44, 44), - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(BorderRadius.md), - ), - side: BorderSide(color: Theme.of(context).colorScheme.border), - ), -) -``` - -#### 幽灵按钮（Ghost） -```dart -TextButton( - style: TextButton.styleFrom( - minimumSize: Size(44, 44), - ), -) -``` - -### 2. 卡片 - -```dart -Card( - elevation: 0, // 使用边框代替阴影 - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(BorderRadius.lg), - side: BorderSide( - color: Theme.of(context).colorScheme.border, - width: 1, - ), - ), - color: Theme.of(context).colorScheme.cardBackground, - child: Padding( - padding: EdgeInsets.all(Spacing.md), - child: Column(...), - ), -) -``` - -### 3. 输入框 - -```dart -TextFormField( - decoration: InputDecoration( - filled: true, - fillColor: Theme.of(context).colorScheme.cardBackground, - border: OutlineInputBorder( - borderRadius: BorderRadius.circular(BorderRadius.md), - borderSide: BorderSide(color: Theme.of(context).colorScheme.border), - ), - enabledBorder: OutlineInputBorder( - borderRadius: BorderRadius.circular(BorderRadius.md), - borderSide: BorderSide(color: Theme.of(context).colorScheme.border), - ), - focusedBorder: OutlineInputBorder( - borderRadius: BorderRadius.circular(BorderRadius.md), - borderSide: BorderSide( - color: Theme.of(context).colorScheme.primary, - width: 2, - ), - ), - contentPadding: EdgeInsets.symmetric( - horizontal: Spacing.md, - vertical: Spacing.sm, - ), - ), -) -``` - -### 4. 现代弹窗 - -#### 标准弹窗 -```dart -showDialog( - context: context, - builder: (context) => Dialog( - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(BorderRadius.xl), - ), - backgroundColor: Theme.of(context).colorScheme.cardBackground, - child: Container( - padding: EdgeInsets.all(Spacing.lg), - child: Column( - mainAxisSize: MainAxisSize.min, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - // 标题 - Text( - 'Dialog Title', - style: Theme.of(context).textTheme.displaySmall, - ), - SizedBox(height: Spacing.md), - // 内容 - Text('Dialog content here...'), - SizedBox(height: Spacing.lg), - // 按钮 - Row( - mainAxisAlignment: MainAxisAlignment.end, - children: [ - TextButton(child: Text('Cancel')), - SizedBox(width: Spacing.sm), - ElevatedButton(child: Text('Confirm')), - ], - ), - ], - ), - ), - ), -); -``` - -#### 底部抽屉（Bottom Sheet） -```dart -showModalBottomSheet( - context: context, - isScrollControlled: true, - backgroundColor: Colors.transparent, - builder: (context) => Container( - decoration: BoxDecoration( - color: Theme.of(context).colorScheme.cardBackground, - borderRadius: BorderRadius.vertical( - top: Radius.circular(BorderRadius.xl), - ), - ), - padding: EdgeInsets.all(Spacing.lg), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - // 拖动指示器 - Container( - width: 40, - height: 4, - decoration: BoxDecoration( - color: Theme.of(context).colorScheme.muted, - borderRadius: BorderRadius.circular(2), - ), - ), - SizedBox(height: Spacing.md), - // 内容 - ... - ], - ), - ), -); -``` - -### 5. 列表项 - -```dart -ListTile( - contentPadding: EdgeInsets.symmetric( - horizontal: Spacing.md, - vertical: Spacing.sm, - ), - leading: Container( - width: 40, - height: 40, - decoration: BoxDecoration( - color: Theme.of(context).colorScheme.secondary, - borderRadius: BorderRadius.circular(BorderRadius.md), - ), - child: Icon(icon, size: 20), - ), - title: Text( - title, - style: Theme.of(context).textTheme.bodyLarge, - ), - subtitle: Text( - subtitle, - style: Theme.of(context).textTheme.bodySmall, - ), - trailing: Icon(Icons.chevron_right, size: 20), -) -``` - -## 页面布局规范 - -### 1. 通用布局 - -```dart -Scaffold( - backgroundColor: Theme.of(context).colorScheme.background, - appBar: AppBar( - backgroundColor: Theme.of(context).colorScheme.background, - elevation: 0, - title: Text('Page Title'), - ), - body: SafeArea( - child: SingleChildScrollView( - padding: EdgeInsets.all(Spacing.md), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - // 内容 - ], - ), - ), - ), -) -``` - -### 2. 响应式布局 - -```dart -LayoutBuilder( - builder: (context, constraints) { - if (constraints.maxWidth >= 1024) { - // 桌面布局 - return _DesktopLayout(); - } else if (constraints.maxWidth >= 768) { - // 平板布局 - return _TabletLayout(); - } else { - // 移动布局 - return _MobileLayout(); - } - }, -) -``` - -## 主题切换实现 - -### 1. 主题 Provider - -```dart -class ThemeProvider extends ChangeNotifier { - ThemeMode _themeMode = ThemeMode.system; - - ThemeMode get themeMode => _themeMode; - - void toggleTheme() { - _themeMode = _themeMode == ThemeMode.light - ? ThemeMode.dark - : ThemeMode.light; - notifyListeners(); - } - - void setTheme(ThemeMode mode) { - _themeMode = mode; - notifyListeners(); - } -} -``` - -### 2. 主题切换按钮 - -```dart -IconButton( - icon: Icon( - Provider.of(context).themeMode == ThemeMode.light - ? Icons.dark_mode - : Icons.light_mode, - ), - onPressed: () { - Provider.of(context, listen: false).toggleTheme(); - }, -) -``` - -## 无障碍设计 - -### 1. 对比度 -- 所有文字/背景组合 >= 4.5:1（WCAG AA） -- 大文字（18sp+）>= 3:1 - -### 2. 触摸目标 -- 最小触摸目标 44x44 - -### 3. 语义化 -```dart -Semantics( - label: 'Submit button', - button: true, - child: ElevatedButton(...), -) -``` - -## 禁止事项 - -- ❌ 使用过时的 Bootstrap 蓝 (#007bff) -- ❌ 沉重的阴影 -- ❌ 复杂的渐变 -- ❌ 文字与背景颜色相同 -- ❌ 对比度 < 4.5:1 -- ❌ 触摸目标 < 44x44 -- ❌ 硬编码颜色值 -- ❌ 不一致的间距/圆角 - -## 验证清单 - -- [ ] 明暗主题切换正常 -- [ ] 所有页面风格一致 -- [ ] 对比度 >= 4.5:1 -- [ ] 触摸目标 >= 44x44 -- [ ] flutter analyze 无错误 -- [ ] 响应式布局正常 -- [ ] 动画流畅（60fps） -- [ ] 无硬编码颜色 -- [ ] 间距/圆角一致 diff --git a/flutter_monisuo/specs/theme-design.md b/flutter_monisuo/specs/theme-design.md deleted file mode 100644 index 0ade8a1..0000000 --- a/flutter_monisuo/specs/theme-design.md +++ /dev/null @@ -1,237 +0,0 @@ -# 数字货币应用主题设计规范 - -## 设计原则 - -1. **一致性** - 所有页面使用统一的设计语言 -2. **可读性** - 确保文字与背景对比度充足 (WCAG AA 标准) -3. **响应式** - 适配不同屏幕尺寸 -4. **专业性** - 符合金融/交易类应用的专业感 -5. **无障碍** - 避免颜色冲突，支持色盲用户 - ---- - -## 颜色系统 - -### 主色调 (Primary) - -``` -主色: #00D4AA (青绿色 - 代表增长、积极) -主色浅: #00E6B8 -主色深: #00B894 -``` - -### 涨跌色 (Trading Colors) - -``` -涨/买入: #00C853 (标准绿 - 国际通用) -跌/卖出: #FF5252 (标准红 - 国际通用) -``` - -### 背景色 (Dark Theme) - -``` -背景主色: #0F0F1A (深蓝黑) -卡片背景: #1A1A2E (深蓝紫) -输入框背景: #16213E (深蓝) -模态框背景: #1E1E32 -``` - -### 文字颜色 - -``` -主要文字: #FFFFFF (白色) -次要文字: #B0B0C0 (灰蓝) -提示文字: #6B6B80 (暗灰) -禁用文字: #4A4A5A -链接文字: #00D4AA -``` - -### 边框与分割线 - -``` -边框: rgba(255, 255, 255, 0.08) -分割线: rgba(255, 255, 255, 0.06) -聚焦边框: #00D4AA -``` - -### 功能色 - -``` -成功: #00C853 -警告: #FF9800 -错误: #FF5252 -信息: #2196F3 -充值: #00C853 -提现: #FF9800 -划转: #2196F3 -``` - ---- - -## 间距系统 - -```dart -static const double xs = 4.0; -static const double sm = 8.0; -static const double md = 16.0; -static const double lg = 24.0; -static const double xl = 32.0; -static const double xxl = 48.0; -``` - -## 圆角系统 - -```dart -static const double sm = 8.0; // 小组件 -static const double md = 12.0; // 按钮、输入框 -static const double lg = 16.0; // 卡片 -static const double xl = 24.0; // 大卡片 -static const double full = 999.0; // 圆形 -``` - ---- - -## 文字排版 - -### 字号 - -``` -h1: 28px - 页面大标题 -h2: 24px - 区块标题 -h3: 20px - 卡片标题 -h4: 18px - 小标题 -body1: 16px - 正文 -body2: 14px - 次要正文 -caption: 12px - 辅助文字 -small: 11px - 极小文字 -``` - -### 字重 - -``` -bold: 700 (标题) -semibold: 600 (强调) -medium: 500 (正文) -regular: 400 (辅助) -``` - ---- - -## 组件规范 - -### 按钮 - -1. **主按钮** - - 高度: 48px - - 圆角: 12px - - 背景: 主题色渐变 - - 文字: 白色, 16px, semibold - -2. **买入按钮** - - 背景: #00C853 渐变 - - 文字: 白色 - -3. **卖出按钮** - - 背景: #FF5252 渐变 - - 文字: 白色 - -4. **轮廓按钮** - - 边框: 1px solid border - - 背景: 透明 - - 文字: 主题色 - -### 输入框 - -- 高度: 48px -- 圆角: 12px -- 背景: #16213E -- 边框: 1px solid rgba(255,255,255,0.1) -- 聚焦边框: #00D4AA -- 文字: 白色 -- 提示: #6B6B80 - -### 卡片 - -- 圆角: 16px -- 背景: #1A1A2E -- 内边距: 16px-20px -- 阴影: 无 (扁平设计) - -### 涨跌标签 - -- 圆角: 6px -- 内边距: 6px 10px -- 涨: 背景 rgba(0,200,83,0.15), 文字 #00C853 -- 跌: 背景 rgba(255,82,82,0.15), 文字 #FF5252 - -### 底部导航 - -- 高度: 60px + safeArea -- 背景: #0F0F1A -- 边框: top 1px solid rgba(255,255,255,0.08) -- 选中色: #00D4AA -- 未选中色: #6B6B80 - ---- - -## 响应式断点 - -```dart -// 手机竖屏 -const double mobile = 360; - -// 手机横屏/小平板 -const double tablet = 768; - -// 平板/桌面 -const double desktop = 1024; -``` - ---- - -## 动画规范 - -- 标准时长: 200ms-300ms -- 缓动曲线: easeOutCubic -- 页面转场: 300ms -- 按钮反馈: 150ms - ---- - -## 无障碍设计 - -1. **对比度**: 所有文字与背景对比度 >= 4.5:1 -2. **触摸目标**: 最小 44x44px -3. **状态反馈**: 不仅依赖颜色区分 -4. **焦点指示**: 明显的焦点样式 - ---- - -## 禁止事项 - -1. ❌ 文字与背景颜色相同 -2. ❌ 纯黑色背景 (#000000) -3. ❌ 纯白色文字在浅色背景 -4. ❌ 低对比度组合 (对比度 < 4.5) -5. ❌ 仅用颜色区分状态 -6. ❌ 过小的触摸目标 (< 44px) -7. ❌ 不一致的组件样式 -8. ❌ 硬编码颜色值 - ---- - -## 实现清单 - -### 核心文件 - -1. `lib/core/theme/app_colors.dart` - 颜色定义 -2. `lib/core/theme/app_theme.dart` - 主题配置 -3. `lib/core/theme/app_text_styles.dart` - 文字样式 -4. `lib/core/theme/app_spacing.dart` - 间距常量 -5. `lib/ui/shared/ui_constants.dart` - 整合导出 - -### 需要优化的文件 - -- 所有 UI 页面文件 -- 所有 UI 组件文件 -- main.dart 主题配置 diff --git a/flutter_monisuo/specs/theme-modernization.md b/flutter_monisuo/specs/theme-modernization.md deleted file mode 100644 index 196f2a0..0000000 --- a/flutter_monisuo/specs/theme-modernization.md +++ /dev/null @@ -1,209 +0,0 @@ -# Monisuo Flutter 主题现代化规范 - -## 项目概况 - -- **项目名称**: flutter_monisuo (虚拟货币模拟交易平台) -- **技术栈**: Flutter 3 + Dart + shadcn_ui 0.52.1 -- **当前状态**: 已集成 shadcn_ui，部分页面已重构 - -## 现代化目标 - -### 1. 统一设计系统 - -#### 1.1 主题配置 -- 当前：Slate 深色主题 -- 目标： - - 统一配色方案（品牌色、涨跌色、中性色） - - 完善的深色/浅色模式支持 - - 自定义品牌色系统 - -#### 1.2 间距系统 -- 标准化 padding/margin/gap -- 使用统一的间距 token -- 响应式布局适配 - -#### 1.3 组件样式 -- 所有按钮统一使用 ShadButton -- 所有卡片统一使用 ShadCard -- 所有输入框统一使用 ShadInputFormField -- 所有图标统一使用 LucideIcons - -### 2. 页面现代化 - -#### 2.1 核心页面（高优先级） -1. **首页 (home_page.dart)** - - 使用 ShadCard 展示资产概览 - - 使用 ShadButton 进行快捷操作 - - 添加 flutter_animate 动画 - -2. **行情页面 (market_page.dart)** - - 币种列表使用 ShadCard - - 价格变化使用 ShadBadge - - 搜索框使用 ShadInput - -3. **交易页面 (trade_page.dart)** - - 买入/卖出使用不同颜色的 ShadButton - - 数量输入使用 ShadInputFormField - - 币种选择使用 ShadSelect - -4. **资产页面 (asset_page.dart)** - - 总资产使用大号 ShadCard - - 充值/提现使用 ShadButton - - 资金列表使用 ShadListTile - -5. **个人中心 (mine_page.dart)** - - 菜单项使用统一布局 - - 设置项使用 ShadSwitch - - 退出登录使用 ShadButton.destructive - -#### 2.2 认证页面（中优先级） -1. **登录页面 (login_page.dart)** - - 已有示例：login_page_shadcn.dart - - 需要替换原文件 - -2. **注册页面 (register_page.dart)** - - 创建 shadcn 版本 - - 完整表单验证 - -#### 2.3 主框架（高优先级） -1. **主页面 (main_page.dart)** - - 已有示例：main_page_shadcn.dart - - 需要替换原文件 - - 优化底部导航 - -### 3. 自定义组件 - -创建业务特定组件： - -#### 3.1 CoinCard - 币种卡片 -```dart -class CoinCard extends StatelessWidget { - final String name; - final String code; - final double price; - final double change24h; - final String iconUrl; - - // 使用 ShadCard + ShadAvatar + ShadBadge -} -``` - -#### 3.2 TradeButton - 交易按钮 -```dart -class TradeButton extends StatelessWidget { - final bool isBuy; - final VoidCallback onPressed; - - // 买入：绿色 ShadButton - // 卖出：红色 ShadButton.destructive -} -``` - -#### 3.3 AssetCard - 资产卡片 -```dart -class AssetCard extends StatelessWidget { - final String title; - final double balance; - final double change; - - // 使用 ShadCard + 大号文本 -} -``` - -#### 3.4 PriceChart - 价格图表 -```dart -class PriceChart extends StatelessWidget { - final List prices; - final bool isUp; - - // 使用 flutter_animate 添加动画 -} -``` - -### 4. 动画系统 - -使用 flutter_animate 添加动画： - -#### 4.1 页面切换动画 -- 淡入淡出 -- 滑动效果 - -#### 4.2 列表加载动画 -- 交错淡入 -- 滑动进入 - -#### 4.3 交互反馈动画 -- 按钮点击缩放 -- 卡片悬停效果 - -### 5. 主题定制 - -#### 5.1 品牌色系统 -```dart -// 自定义品牌色 -const brandGreen = Color(0xFF00D4AA); // 品牌绿 -const upColor = Color(0xFF10B981); // 涨 -const downColor = Color(0xFFEF4444); // 跌 -``` - -#### 5.2 配色方案选择 -- **Slate**（当前）：专业、稳重 -- 可选：Zinc（现代）、Blue（活力） - -## 禁止事项 - -- ❌ 不要修改业务逻辑 -- ❌ 不要修改 API 调用 -- ❌ 不要修改数据模型 -- ❌ 不要删除现有功能 -- ❌ 不要改变 Provider 逻辑 - -## 验证标准 - -### 功能验证 -- [ ] 用户可以登录/注册 -- [ ] 可以查看行情 -- [ ] 可以进行交易 -- [ ] 可以查看资产 -- [ ] 可以修改设置 - -### 视觉验证 -- [ ] 所有页面使用统一的组件 -- [ ] 所有页面有一致的间距 -- [ ] 所有页面有流畅的动画 -- [ ] 深色模式完美支持 - -### 代码验证 -- [ ] 无 Dart 分析错误 -- [ ] 无 Flutter 警告 -- [ ] 构建成功 -- [ ] 无运行时错误 - -## 重构优先级 - -### P0 - 立即执行 -1. 替换 main_page.dart 为 shadcn 版本 -2. 替换 login_page.dart 为 shadcn 版本 -3. 重构 home_page.dart - -### P1 - 高优先级 -1. 重构 market_page.dart -2. 重构 trade_page.dart -3. 重构 asset_page.dart - -### P2 - 中优先级 -1. 重构 mine_page.dart -2. 重构 register_page.dart -3. 创建自定义组件 - -### P3 - 低优先级 -1. 优化动画 -2. 添加高级效果 -3. 性能优化 - -## 参考资源 - -- [shadcn_ui Flutter 文档](https://flutter-shadcn-ui.mariuti.com/) -- [Lucide Icons Flutter](https://pub.dev/packages/lucide_icons_flutter) -- [flutter_animate](https://pub.dev/packages/flutter_animate) -- [REFACTOR_PLAN.md](../REFACTOR_PLAN.md) - 已有的重构计划