F7.11.2Coherent mid-state on cancel设计

可打断的动效需要在中断点仍呈现合理的中间状态

别名: 中断中间态 · 半透明残留 · 取消后的布局

概念解释

中途取消时若页面停在半透明、双层叠着、按钮不可点,打断比播完更糟,因为中间态没有对应的界面契约。可打断不仅是「输入能进来」,还要求取消落点是一个合法状态:要么跳到终态,要么退回始态,不能把插值帧当成产品状态留下。

机制

动画的中间帧是渲染用的,不是领域状态。插值 40% 时,路由可能已经是 B,像素还停在 A 和 B 之间,命中区两边都不全。若取消只是 stop() 而不提交或回滚模型,用户面对的是一个从未被设计过的第三页:遮罩在、内容残缺、返回栈与所见不一致。

合理的落点通常只有两个。接受这次导航:瞬间(或极短淡入)落到 B 的完整布局。拒绝这次导航:回到 A 的完整布局,并清掉 B 的半成品图层。手势返回按手指进度预览中间帧是合法的,因为松手后必须吸附到 A 或 B,不允许停在 40%。

边界

  • 共享元素在 40% 被取消,两端表面都可能暂时不可用,需要先恢复源列表项再拆掉详情层,顺序反了会闪一下空白洞。
  • 减弱模式下中间帧本来就少,落点问题更轻,但硬切取消仍要保证栈与焦点正确。
  • 游戏里的表演性运动可以停在任意帧,那是内容时间轴,不是界面状态机。

怎么落地

  • 为每条可打断过渡定义取消时的提交/回滚:松手阈值以上进终态,以下回始态。
  • 禁止把当前插值透明度、位移写进持久布局。
  • 验证:在 30%、50%、80% 各取消一次,检查返回栈、焦点、命中区。出现双层可点或全不可点,中间态就没有契约。

延伸

  • 同组F7.11.1 用户的下一步操作不应被等待未完成的动效阻塞 · F7.11.3 连续快速操作触发的动效应合并或跳过而非排队播放 · F7.11.4 不可打断的强制动效会在高频操作场景中被感知为拖慢
  • 相邻G4.01 返回栈与返回语义 · F7.04.3 共享元素失败时需退化为普通转场
  • 站内检索animation cancel · interactive pop · settled state

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/F7.11.2