在动画过程中,要审慎的选择共享元素的数量和类型,来构建清晰的视觉焦点。
所有当前内容都为共享元素
当材质面(Surface)扩张时,一些元素应该全程保持可见,应该将它们做为两种状态的共享元素。
而复杂的动画效果应该保证某一重要元素全程清晰可见(见下)
All elements from this collapsed card form the header of the expanded card.
少数内容或没有内容做为共享元素
材质面(Surface)扩张时,如果仅仅有 单一元素 在转场完成后保留,那么这个元素应该成为动画的视觉焦点,以这个元素为依据,统一控制其它元素。
在单一共享元素的动画中,利用锚点移动,将共享元素打造为视觉焦点。
如果视图之间 没有共享元素,将所有淡入淡出的元素的Y轴运动和材质面的Y轴运动关联。材质面包含并裁剪内容。
将所有非共享元素的 Y 轴运动和材质面(Surface)高度扩展的运动关联。
没有共享材质面(不推荐)
可以接受没有共享元素,然而不推荐没有共享材质面(Surface),如果 没有共享材质面 来完成动画过渡效果,那么新的材质面要从屏幕外入场,以便构建新的视觉焦点。
多个共享元素
当动画前后保留有 多个共享元素 时,要让最重要的共享元素始终可见。如果重要等级较低的共享元素动画较为复杂混乱,可以考虑让它们在动画过程中消失,然后在动画结束后出现。
用最重要的共享元素引导用户的视觉焦点至下一个视图。
要避免毫无焦点的动画,例如动画过程中展示过多的共享元素,或让共享元素的位移路径交叉,这都是错误的动画做法。
布局感知性
当动画完成后,元素没有完全加载时,在元素加载处要保留有足够的空间,以便元素加载完成后出现。这种处理避免了当新元素出现时布局改变。而且,避免了用户在此时操作出现的界面元素突然偏移的现象。
在动画过程中,为未加载完成的元素腾出空间,然后在读取完成时优雅的展示。
当元素读取完成,进入视图时,不要让布局产生大幅偏移,这会让用户改变注意焦点,从而分心。