在界面中,我们常用阴影来模拟元素之间的物理层级关系。清晰自然的阴影能帮助用户快速理解界面中元素的空间关系,更清楚的理解整理界面内容。
阴影是由两个不同阶层的平面产生,且强度由两者之间的距离决定。所以物体的高度直接影响物体的阴影,对象离地面越远阴影越大,模糊值越高。不同的阴影高度可以代表不同的UI层。
阴影是模拟的真实世界的反馈,资产云为了更符合真实阴影,采用了三层阴影的表达方式,让阴影更柔和,更符合真实状态。
低层级元素(如卡片等)的默认阴影可使用一级阴影,中层级元素一般是和底层元素相关联的(如时间选择器,下拉菜单等)可使用二级阴影,高层级元素需要进行突出展示表现在界面最上层(如弹窗、通知等)可使用三级阴影。

截屏2022-03-16 下午2.48.46.png

Last Updated: 4/25/2022, 6:31:05 PM