# 方案1 深色版本 双端参考说明（优先弹窗定稿）

## 1. 核心流程

| 阶段 | 规则 |
| --- | --- |
| 点击“是” | 立即触发较强震感；本次经期范围内格子先变白 white_A，并在选中开始日显示黄色开始 icon；随后弹出记经期必填弹窗。此时不开始血流动画。 |
| 弹窗确定 | 展开下方当天记录列表，同时开始播放日历血流动画。 |
| 弹窗取消/点击“否” | 不记录、不播放血流、不触发额外强震感，恢复未记录态。 |
| 血流播放中 | 日历表格禁用，不能切换其他日期；下方当天记录列表可操作。 |
| 血流完成 | 弹出分析弹泡；分析弹泡出现后，本次记录完成，恢复日期选择和操作。 |

## 2. 颜色规则

| 对象 | 规则 |
| --- | --- |
| 白底中间态 | 点击“是”后、必填弹窗弹出前，本次经期范围内格子变白 white_A，并显示黄色开始 icon。 |
| 历史日/今天文字 | #FF4D88。 |
| 未来日文字 | #FFCADB。 |
| 血液液面 | #FF4D88。 |
| 文字反白 | 血液覆盖文字时覆盖部分变白，未覆盖部分保持原粉色。 |
| 最终定格-历史日/今天 | 格子 #FF4D88，文字 #FFFFFF。 |
| 最终定格-未来日 | 格子 #FFD6E4，文字 #FFFFFF。 |

## 3. 血量比例

不提供 1 天模型。2-7 天按对应比例播放；8 天以上前 7 天逐格播放，第 8 天及以后统一 5% 液面反馈，最后一起冲满 100%。跨月经期按整段真实周期计算，不按当前日历视图截断。

| 天数 | 比例 |
| --- | --- |
| 2 | [60, 100] |
| 3 | [60, 90, 40] |
| 4 | [50, 90, 60, 30] |
| 5 | [40, 80, 60, 30, 20] |
| 6 | [35, 80, 65, 40, 22, 12] |
| 7 | [30, 60, 85, 65, 40, 24, 15] |
| 8+ | [30, 60, 85, 65, 40, 24, 15, 5, 5, 5...] |

## 4. 动效参数

| 参数 | 值 |
| --- | --- |
| 单格时长 | duration = 125 + level * 5.3 |
| 100% 单格参考 | 655ms |
| 白底中间态停留 | 115ms |
| 重叠比例 | 0.35 |
| 最小启动间隔 | 118ms |
| 统一冲满等待 | 170ms |
| 统一冲满时长 | 360ms |
| 目标总时长 | 5 天约 1.9s；15 天约 2.4s；整体不超过 2.5s |

## 5. 震感

点击“是”需要较强震感。iOS 建议使用 UIImpactFeedbackGenerator(style: .heavy)，Android 使用系统允许的强震感能力。点击“否”或取消不触发额外强震感；iOS 可保留系统控件默认反馈，Android 不调用震动。

## 6. 打断与降级

血流播放中，日历表格禁用，下方当天记录列表可操作。若页面触发不可见中断，例如切换 tab、进入二级页、退后台、锁屏等，不续播半截动画；回来后按接口最终结果展示成功最终态或失败回滚态。低性能或 Reduce Motion 可降级关闭水波纹，保留高度、文字反白和最终定格。