Material Design 设计环境

三维世界(3D world)

Material 环境是一个三维的空间,这意味着每个对象都有 x , y , z 三维坐标属性,z 轴垂直于显示平面,并延伸向用户视角,每个 material 元素在 z 轴上占据一定的位置并且有一个 1dp 厚度的标准。 在网页上,z 轴被用来分层而不是为了视角。3D 空间通过操纵 y 轴进行仿真。

具备 x,y 和 z 轴的 3D 空间

具备 x,y 和 z 轴的 3D 空间

光影关系(Light and shadow) 在 material 环境中,虚拟的光线照射使场景中的对象投射出阴影,主光源投射出一个定向的阴影,而环境光从各个角度投射出连贯又柔和的阴影。

material 环境中的所有阴影都是由这两种光投射产生的,阴影是光线照射不到的地方,因为各个元素在z轴上占据了不同大小的位置遮挡住了这些光线。

Material Design 设计环境
直射光投射的阴影

Material Design 设计环境
散射光投射的阴影

Material Design 设计环境
直射光和散射光混合投影

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/258996.html

(0)
上一篇 2022年5月21日
下一篇 2022年5月21日

相关推荐

发表回复

登录后才能评论