你有没有做过一个动画，逻辑上完全正确，跑起来就是差一帧？我在呼吸 App 的引导动画上卡了很久。
「呼吸视界」是我自己做来用的——开会前容易焦虑，试过市面上几款呼吸 App，要么广告满天飞，要么 UI 花里胡哨反而更烦躁。我想要的很简单：打开 App，跟着做 2 分钟，然后关掉。没有会员弹窗，没有打扰。所以就自己写了一个。
核心功能长什么样
整个 App 围绕「结构化呼吸训练」展开，不是单纯的计时器。
引导练习模块支持几种经典呼吸法：4-7-8 呼吸（吸气 4 秒、屏息 7 秒、呼气 8 秒，适合睡前放松）、盒式呼吸（4 秒吸、4 秒屏、4 秒呼、4 秒屏，据说是军队用来对抗急性压力的方法）。每种呼吸法都有视觉引导动画，跟着节奏走，不用自己数数。
课程计划模块是我觉得和同类产品差别最明显的地方。单次练习固然有用，但如果能坚持按计划走，效果差很多。所以我在 App 里做了ProgramProgressRecord——记录用户在每个课程里完成到哪一节，下次打开自动续上，不用重新找进度。
训练历史全部本地存储，不上云，不需要注册账号。这个决策是有意为之：呼吸练习属于私人的健康数据，我自己也不想交出去。
动画同步：三个坑，前两个都扔掉了
呼吸引导动画的核心难点是「动画帧和呼吸阶段要精确同步」。用户吸气 4 秒，圆形扩张动画就得恰好 4 秒跑完，不能有肉眼可见的误差，不然反而让用户更紧张。
坑一：CADisplayLink 手动算 phase 进度
精度够，但 phase 切换时有跳帧——具体现象是相邻两个 phase 的起始帧之间有约 1 帧的空白，圆形会在切换瞬间轻微抖一下，用户能感知到。找了半天，本质原因是 CADisplayLink 回调时机和 phase 边界不对齐，差一帧的距离。代码量也不小，最后放弃了。
坑二：Timer + UIView.animate
Timer 在 iOS 后台节能机制下会漂移，实测在低电量模式下 4 秒的 phase 可能跑成 4.3 秒，动画和实际计时脱节，圆形已经跑完了但下一阶段还没触发，用户就傻等着。这个精度对一般 UI 场景无所谓，但对呼吸引导来说体验直接崩掉。
方案三：SwiftUI withAnimation 配合 DispatchQueue.asyncAfter
代码简洁，关键是withAnimation(.linear(duration:))的 duration 和asyncAfter的 deadline 来自同一个phase.duration，物理上不可能错开。最终选了这个。
funcstartPhase(_phase:BreathPhase){currentPhase=phase progress=0.0withAnimation(.linear(duration:phase.duration)){progress=1.0}// 注意：asyncAfter 在 App 切入后台后可能被挂起导致延迟触发// 如果需要处理后台挂起，要搭配 Task.sleep 或 backgroundTask 机制// 这块我还没做完，留坑DispatchQueue.main.asyncAfter(deadline:.now()+phase.duration){[weakself]inguardletselfelse{return}letnext=self.currentPhase.next(for:self.pattern)self.startPhase(next)}}``` 每个 phase 结束时自动推进下一个，动画和等待时间绑死在同一个值上，跳帧和漂移都没了。在主流设备上跑得很稳，极端低电量和频繁前后台切换场景是下一个要补的坑。---## 课程进度持久化：为什么没用CoreData`ProgramProgressRecord` 存的字段不复杂：课程ID、当前节索引、最近一次练习时间、总完成次数。用 `Codable` 序列化后写进 `UserDefaults`。 选 `UserDefaults` 而不是CoreData或SwiftData，理由很具体：用JSONEncoder实测了一下，单条 record 序列化出来180字节左右，App内课程总数20个左右，全部存下来也就 4KB 不到。CoreData在这个数据量上纯属杀鸡用牛刀，反而多了 schema 迁移的风险。 ```swiftstructProgramProgressRecord:Codable{letprogramId:StringvarcurrentSessionIndex:IntvarlastPracticedAt:Date?vartotalCompletedSessions:Intmutatingfuncadvance(){currentSessionIndex+=1totalCompletedSessions+=1lastPracticedAt=Date()}}```---## 设计决策：克制比丰富更难 做这类「正念」工具，UI的诱惑是往简约风靠，加磨砂玻璃、加渐变光晕、加粒子效果……我自己也差点走这条路。 后来把所有装饰性动画删掉了大半。原因是：用户打开App是来「平静」的，不是来「被App的设计感动」的。动效多了本身就是噪音。 颜色方案最终锁定深色背景+单一强调色，字体只用系统字体，间距用固定的 `enumSpacing` token 约束——就是所有间距值都定义成常量，不在代码里直接写16、24这样的裸数字，改起来不容易出错。这样做的副作用是视觉上「没那么惊艳」，但用起来不累。 对了，App名字叫「呼吸视界」，「视界」取的是「视野/视角」的意思——通过呼吸重新看待当下的状态。不是什么高深的东西，就是一个我觉得贴切的名字。---## 实际使用场景 我自己用得最多的是两个场景：**开会前**：打开App，选4-7-8，做一轮（大概2分钟），心跳明显下来了。说出来可能有点玄，但试过很多次，效果是真的有。**睡前**：躺下之后刷手机越刷越睡不着，换成打开呼吸视界跟着做放松呼吸，一般两轮就能进入睡眠状态。 有用户留言说「可以跟随练习呼吸，保持稳定的心情」，我看到这条的时候挺高兴的——说明做的东西真的有人在用。---## 现在的状态和后续AppStore上线是2024年底，目前版本1.8，评分5分。下载量说实话不多，早期基本靠朋友圈传播，没有买量。 接下来想做的：-练习结束后加一个简短的「感受记录」，纯文本，不评分不打标签，就是让用户写两句话--支持AppleWatch，手腕震动引导呼吸节奏会更沉浸--后台挂起时的动画同步容错，这个坑得填---我这套 `withAnimation+asyncAfter` 的方案在主流设备上跑稳了，低电量极端场景欢迎来踩——如果你做过类似的引导动画，不管是呼吸类、冥想类还是其他需要精确节奏同步的场景，欢迎在评论区聊聊你的方案，看看有没有比 `asyncAfter` 更优雅的处理后台挂起的路子。
