Material 动效通过在过渡过程中共享元素的运动来引导用户的视觉焦点。
创建表面
将新创建的表面作交错排列。
径向反馈
使用触摸涟漪将用户输入与表面的反馈联系起来。

Material 动效通过在过渡过程中共享元素的运动来引导用户的视觉焦点。
将新创建的表面作交错排列。
使用触摸涟漪将用户输入与表面的反馈联系起来。

仔细选择在过渡中共享的元素类型和数量,以保持清晰的视觉焦点。
当表面扩展时,应有相当数量的元素在过渡过程中保持可见。
复杂的过渡应将视觉焦点集中在一个单一的关键元素上(见下文)。
此折叠卡片中的所有元素,共同构成了展开后卡片的头部。
当扩展一个表面时,如果在过渡后只存在单个元素,则该元素应作为过渡的焦点,并控制所有其他元素。
将非共享内容锚定到单个共享元素的运动上。
如果视图之间没有共享的元素,则将所有交叉淡入淡出的元素锚定到表面的纵向移动上。表面会裁剪其中的内容。
将所有非共享内容锚定到扩展表面的纵向运动上。
如果在过渡过程中没有共享表面,就会有一个新表面从其他位置进入屏幕,形成一个新的视觉焦点。
当有多个元素在过渡过程中可见时,应该仅包含最重要的元素。如果某些元素在过渡过程中可能分散注意力,则可以在过渡期间将其隐藏,待过渡完成后再重新显示。
推荐做法
使用最重要的共享元素将用户的焦点引导到下一个视图。
不推荐做法
避免创建没有焦点的场景,例如在过渡期间使用大量共享元素,或让元素的运动路径相互交叉。
如果过渡完成时还有元素尚未加载,请在元素即将出现的位置预留足够的空间。这可以避免元素突然出现时造成布局突然跳动或抖动,也能防止因触摸目标突然移动而给用户带来挫败感。
推荐做法
在过渡期间为尚未加载的元素预留空间,待其完全加载后优雅地呈现出来。
不推荐做法
不要在元素加载进视图时改变布局,否则会分散注意力并导致焦点偏移。
新的材质表面及其内容可以凭空创建。
将新创建的表面与创建它们的元素或操作关联起来。新表面通常以径向或矩形展开的方式从触摸点出现。
推荐做法
此菜单从触摸点出现,从而将元素与触摸点绑定。
不推荐做法
此菜单在远离触发它的触摸点处出现,破坏了它与输入方式之间的关联。
当同时创建多个新表面时,应以快速交错的方式呈现每个表面。在单一方向上创建一条清晰、平滑的视觉路径。
推荐做法
列表项有一个略微交错的入场效果。网格项的交错顺序为从左到右、从上到下。
不推荐做法
列表项不应同时全部出现。这会造成视觉过载,并使清晰的焦点消失。
不推荐做法
带有交错入场效果的列表项,其出现顺序不应令人困惑。
不推荐做法
不要等前一个项目的动画完全结束后才开始呈现下一个项目。每个项目的交错入场间隔不应超过 20 毫秒。
在没有用户输入或没有明确起点的情况下创建的表面,应通过结合淡入淡出、位移和缩放变换来实现优雅的出现。
推荐做法
自动触发的表面应平滑且快速地出现。
不推荐做法
表面创建过程中过多的动画会分散用户的注意力。
使用径向反馈来阐明用户输入与表面反馈之间的联系。
使用触摸涟漪将用户输入与屏幕反馈联系起来,既能指示触摸点,又能确认触摸输入已被接收。无论是触摸还是鼠标操作,涟漪效果都应出现在接触点。
靠近触摸点发生的屏幕反馈,应比远处发生的反馈出现得更早。
使用触摸涟漪将屏幕反馈与触摸点关联起来。
从触摸点开始,应用栏会随着新颜色向外扩散而改变颜色。
此网格中的图片根据点击点周围的径向反馈淡出。