# 阶段总结：UI 规范化与按钮/头部统一

> **日期**：2026-02-07
> **范围**：全 App UI 一致性审计与修复

---

## 一、书架页面优化

### 改动
- **书架高度**：56% → 64% 屏幕高
- **布局**：`padEnds: true` → `false`，整体左移，右侧虚线框文字完全露出
- **解锁新书架动画**：从两组文字改为一组，丝滑从 peek 位置滑到中心
  - 锁图标大小 `lerpDouble(20, 32, t)` 连续插值
  - 文字从竖排变横排
- **创作新故事按钮**：上移，离底部菜单栏更远

---

## 二、头部样式统一（12 个文件）

### 统一规范
| 属性 | 旧值（不一致） | 新值（统一） |
|------|------|------|
| 返回按钮尺寸 | 44×44 | **40×40** |
| 返回按钮圆角 | 14/20/22 | **12** |
| 返回按钮背景透明度 | 0.25/0.45 | **0.6** |
| 返回按钮边框 | 有/无 | **无** |
| 图标类型 | arrow_back | **arrow_back_ios_new** |
| 图标大小 | 20 | **18** |
| 标题字号 | 18/20 | **17** |
| 标题字重 | w700 | **w600** |
| 标题颜色 | #374151 | **#1F2937** |

### 涉及文件
- `design_tokens.dart` — 公共变量调整
- 7 个 profile 页面 — notification, settings_sub, guide_feeding, help, agent_manage, profile_info, settings
- 3 个硬编码页面 — music_creation, story_detail, profile/settings
- `settings_sub_pages.dart` — 新增 AnimatedGradientBackground

---

## 三、主按钮统一为 GradientButton 组件

### 统一规范
| 属性 | 值 |
|------|------|
| 组件 | `GradientButton`（统一入口） |
| 光泽效果 | 顶部白色渐变 15% → 透明 |
| 点击反馈 | InkWell 涟漪 |
| 字体 | DM Sans, 17px, w600, 白色 |
| 圆角 | height/2（胶囊形） |

### 改动文件
| 文件 | 按钮 | 改动 |
|------|------|------|
| `device_control_page.dart` | + 创作新故事 | 手写 Container → GradientButton |
| `bluetooth_page.dart` | 连接设备 | 手写 Container → GradientButton |
| `music_creation_page.dart` | 生成音乐 🎵 | 手写 → GradientButton |
| `music_creation_page.dart` | 立即试听 | 手写 → GradientButton |
| `glass_dialog.dart` | 确定（单按钮） | 手写 → GradientButton |
| `glass_dialog.dart` | 确定（双按钮） | 手写 → GradientButton |
| `login_page.dart` | 同意并继续 | 手写 → GradientButton |
| `login_page.dart` | 立即登录 | 手写 → GradientButton |
| `gradient_button.dart` | 默认高度 | 50 → 48 |
| `gradient_button.dart` | plush 字号 | 18/w700 → 17/w600（统一） |
| `story_detail_page.dart` | 所有按钮高度 | 46 → 48 |
| `story_detail_page.dart` | 次级按钮圆角 | 23/25 → 24 |

### 保持特殊实现的按钮
- `home_page.dart` — "立即连接"：有 shine 扫光动画，但已包含光泽+涟漪+正确字体

### 不需要改的小型按钮
- profile_info 的"保存"/"确定" — 头部/picker 内小按钮
- help_page 的"查看 →" — 卡片内导航小按钮

---

## 四、全局 Toast 系统

- 提取 `ios_toast.dart` — iOS 风格毛玻璃 toast
- 全 App 替换 SnackBar 为 `AppToast.show()`
- 支持 `isError` 参数区分成功/错误样式

---

## 五、其他修复
- WiFi 配置页返回白屏 → 改为 `context.go('/home')`
- 产品选择页卡片渐隐效果 → per-card Opacity 方案
- C 盘清理 → 释放 ~9.5GB + AVD 迁移至 D 盘