SuperAPI AI 工具集

ns-navigation-transitions

设计与创作

查看项目

更新于 10-16 06:50

技能介绍

用途:指导编写或审查 NativeScript 中的 Frame.navigate 与 Angular 的 RouterExtensions.navigate 调用,避免用自定义转场替换系统导航动画。

主要观点:navigate 的 transition 选项几乎总应省略。省略后由系统接管——iOS 使用 UINavigationController 的 push/pop,Android 使用原生 fragment 转场并支持预测性返回。自定义转场(如 slideLeft、fade、flip)会用手写动画器替换系统转场协调器,导致导航栏交叉淡入、返回按钮标签滑动、iOS 26 的 Liquid Glass 变形、大标题收起等整体 chrome 动画丢失,页面与导航栏脱节;同时失去 iOS 边缘滑动返回与 Android 预测性返回等交互式手势,也无法跟随系统动效曲线与 Reduce Motion 设置,并需在系统改版后自行维护。

合理例外:用户未主动触发的初始或状态恢复导航用 { animated: false };登录到主应用切换、登出重置用 { clearHistory: true, animated: false };覆盖层、选择器、浮层流程应使用 Modal(showModal 或对应对话框服务),而非在 push 上伪造模态;仅在刻意设计的时刻(如启动页到主页交叉淡入、共享元素展示)才使用自定义转场。

审查清单:用 grep -rn "transition" src --include="*.ts" 检查每处命中是否属于上述例外并说明理由;animated: false 只用于用户未发起的导航;在真机上验证 iOS push 后边缘滑动返回时页面与导航栏是否同步跟随手指,Android 检查预测性返回预览,若出现脱节通常说明自定义转场在干扰。

限制:资料未提供安装命令、版本要求或完整代码示例;验证信息为 2026-08 在 iOS 26 模拟器与 Android 15 模拟器、@nativescript/core 9.1.0-alpha.11 下完成。