F7.04.3Shared-element fallback设计
共享元素失败时需退化为普通转场
别名: 共享元素回退 · 对不上的英雄转场 · 退化转场
概念解释
共享元素依赖两端都能指出同一块表面。列表项被回收、图片还在下载、源已经滚出屏幕、两端宽高比完全对不上时,对应关系在几何上就不存在。这时硬做形变,得到的不是身份连续,而是两件东西在融化。失败需要退化成普通转场——淡入、方向性滑入、甚至硬切——让两个完整状态先后出现,好过一个错误的中间物体。
机制
渲染层按 ID 或几何锚点去配对。配对落空时,实现常常拿「最近的同类视图」或一个空矩形去插值,于是用户看见无关的卡片飞向详情,或看见一张空白框胀开。错误对应比没有对应更贵:它写入一条假的对象档案,后续返回会找错行。
普通转场不承诺身份焊缝,只承诺「页在换」。淡入保留两个完整表面;方向性滑入还能保住层级方向。它们的信息量低于成功的共享元素,但不会主动撒谎。退化不是降级体验的借口,是在对应前提消失时停止伪造。
边界
- 源只是暂时离屏、滚动回来还在,可以等源进入视口再共享,不必立刻退化;等太久则变成假延迟。
- 两端是同一张图的不同裁切,有时可用交叉淡入而不是几何形变,这仍是一种退化,不是硬拉。
- 全产品没有方向约定时,退化成滑入会引入一条新的空间谎言,不如淡入。
怎么落地
- 在配对前检查:源视图是否仍在层级里、图像是否已解码、尺寸比是否可接受。任一失败就走淡入或既有的页面转场。
- 不要用邻近的另一项顶替丢失的源。
- 验证:人为让图片加载失败、让源项被回收、让源滚出屏幕,各走一次详情。若仍出现飞错卡片或空白框拉伸,回退分支没有接上。